Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-10 09:08:31 -05:00
Code Issues Activity

Merge pull request #4271 from penpot/alotor-bugfix-29

Browse source 
Bugfixing
This commit is contained in:
Eva Marco 2024-03-14 17:32:13 +01:00 • committed by GitHub
commit a237a82e6f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 134 additions and 94 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
backend/src/app/features/components_v2.clj
View file

@ -806,7 +806,8 @@
:width (:width (:selrect root-shape))
:height (:height (:selrect root-shape))
:name (:name component)
:shapes [new-id]})
:shapes [new-id]
:show-content true})
(assoc :frame-id nil
:parent-id nil))
root-shape' (assoc root-shape
@ -846,13 +847,15 @@
(fix-shape [shape]
(if (or (nil? (:parent-id shape)) (ctk/instance-head? shape))
(assoc shape
:type :frame ; Old groups must be converted
:fills (or (:fills shape) []) ; to frames and conform to spec
:shapes (or (:shapes shape) [])
:hide-in-viewer (or (:hide-in-viewer shape) true)
:rx (or (:rx shape) 0)
:ry (or (:ry shape) 0))
(let [frame? (= :frame (:type shape))]
(assoc shape
:type :frame ; Old groups must be converted
:fills (or (:fills shape) []) ; to frames and conform to spec
:shapes (or (:shapes shape) [])
:hide-in-viewer (if frame? (boolean (:hide-in-viewer shape)) true)
:show-content (if frame? (boolean (:show-content shape)) true)
:rx (or (:rx shape) 0)
:ry (or (:ry shape) 0)))
shape))]
(-> file-data
(update :pages-index update-vals fix-container)

14
common/src/app/common/files/changes.cljc
View file

@ -609,11 +609,15 @@
(defmethod process-change :add-recent-color
[data {:keys [color]}]
;; Moves the color to the top of the list and then truncates up to 15
(update data :recent-colors (fn [rc]
(let [rc (conj (filterv (comp not #{color}) (or rc [])) color)]
(if (> (count rc) 15)
(subvec rc 1)
rc)))))
(update
data
:recent-colors
(fn [rc]
(let [rc (->> rc (d/removev (partial ctc/eq-recent-color? color)))
rc (-> rc (conj color))]
(cond-> rc
(> (count rc) 15)
(subvec 1))))))
;; -- Media

6
common/src/app/common/types/color.cljc
View file

@ -358,3 +358,9 @@
(process-shape-colors shape sync-color)))
(defn eq-recent-color?
[c1 c2]
(or (= c1 c2)
(and (some? (:color c1))
(some? (:color c2))
(= (:color c1) (:color c2)))))

2
frontend/src/app/main/data/preview.cljs
View file

@ -76,7 +76,7 @@
(let [style-code
(dm/str
fontfaces-css "\n"
(-> (cg/generate-style-code objects style-type all-children)
(-> (cg/generate-style-code objects style-type [shape] all-children)
(cb/format-code style-type)))
markup-code

9
frontend/src/app/main/ui/components/numeric_input.cljs
View file

@ -169,6 +169,13 @@
(update-input value-str)
(dom/blur! node)))))
handle-change
(mf/use-fn
(mf/deps parse-value)
(fn []
;; Store the last value inputed
(reset! last-value* (parse-value))))
handle-mouse-wheel
(mf/use-fn
(mf/deps set-delta)
@ -218,7 +225,7 @@
(obj/unset! "selectOnFocus")
(obj/unset! "nillable")
(obj/set! "value" mf/undefined)
(obj/set! "onChange" mf/undefined)
(obj/set! "onChange" handle-change)
(obj/set! "className" class)
(obj/set! "type" "text")
(obj/set! "ref" ref)

4
frontend/src/app/main/ui/dashboard.cljs
View file

@ -58,6 +58,9 @@
project-id (:id project)
team-id (:id team)
dashboard-local (mf/deref refs/dashboard-local)
file-menu-open? (:menu-open dashboard-local)
default-project-id
(mf/with-memo [projects]
(->> (vals projects)
@ -83,6 +86,7 @@
[:div {:class (stl/css :dashboard-content)
:style {:pointer-events (when file-menu-open? "none")}
:on-click clear-selected-fn :ref container}
(case section
:dashboard-projects

21
frontend/src/app/main/ui/dashboard/grid.cljs
View file

@ -388,15 +388,18 @@
(on-menu-click event)))}
menu-icon
(when (and selected? file-menu-open?)
[:& file-menu {:files (vals selected-files)
:show? (:menu-open dashboard-local)
:left (+ 24 (:x (:menu-pos dashboard-local)))
:top (:y (:menu-pos dashboard-local))
:navigate? true
:on-edit on-edit
:on-menu-close on-menu-close
:origin origin
:parent-id (str file-id "-action-menu")}])]]]]]))
;; When the menu is open we disable events in the dashboard. We need to force pointer events
;; so the menu can be handled
[:div {:style {:pointer-events "all"}}
[:& file-menu {:files (vals selected-files)
:show? (:menu-open dashboard-local)
:left (+ 24 (:x (:menu-pos dashboard-local)))
:top (:y (:menu-pos dashboard-local))
:navigate? true
:on-edit on-edit
:on-menu-close on-menu-close
:origin origin
:parent-id (str file-id "-action-menu")}]])]]]]]))
(mf/defc grid
[{:keys [files project origin limit library-view? create-fn] :as props}]

4
frontend/src/app/main/ui/viewer/inspect/code.cljs
View file

@ -124,11 +124,11 @@
style-code
(mf/use-memo
(mf/deps fontfaces-css style-type all-children cg/generate-style-code)
(mf/deps fontfaces-css style-type shapes all-children cg/generate-style-code)
(fn []
(dm/str
fontfaces-css "\n"
(-> (cg/generate-style-code objects style-type all-children)
(-> (cg/generate-style-code objects style-type shapes all-children)
(cb/format-code style-type)))))
markup-code

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.scss
View file

@ -113,7 +113,7 @@
.padding-simple {
@extend .input-element;
width: $s-108;
max-width: $s-108;
}
}
@ -124,7 +124,7 @@
.padding-multiple {
@extend .input-element;
width: $s-108;
max-width: $s-108;
}
}

4
frontend/src/app/util/code_gen.cljs
View file

@ -19,8 +19,8 @@
(generate-markup objects shapes)))
(defn generate-style-code
[objects type shapes]
[objects type root-shapes all-shapes]
(let [generate-style
(case type
"css" css/generate-style)]
(generate-style objects shapes)))
(generate-style objects root-shapes all-shapes)))

40
frontend/src/app/util/code_gen/style_css.cljs
View file

@ -35,8 +35,8 @@ body {
display: flex;
flex-direction: column;
align-items: center;
padding: 2rem;
gap: 2rem;
width: 100vw;
min-height: 100vh;
}
* {
@ -94,6 +94,7 @@ body {
:flex-direction
:flex-wrap
:flex
:flex-grow
;; Grid related properties
:grid-template-rows
@ -117,8 +118,8 @@ body {
:grid-area])
(defn shape->css-property
[shape objects property]
(when-let [value (get-value property shape objects)]
[shape objects property options]
(when-let [value (get-value property shape objects options)]
[property value]))
(defn shape->wrapper-css-properties
@ -155,10 +156,10 @@ body {
(defn shape->css-properties
"Given a shape extract the CSS properties in the format of list [property value]"
[shape objects properties]
[shape objects properties options]
(->> properties
(keep (fn [property]
(when-let [value (get-value property shape objects)]
(when-let [value (get-value property shape objects options)]
[property value])))))
(defn format-css-value
@ -189,7 +190,7 @@ body {
([objects shape properties options]
(-> shape
(shape->css-properties objects properties)
(shape->css-properties objects properties options)
(format-css-properties options))))
(defn format-js-styles
@ -248,13 +249,13 @@ body {
properties
(-> shape
(shape->css-properties objects css-properties)
(shape->css-properties objects css-properties options)
(format-css-properties options))
wrapper-properties
(when wrapper?
(-> (d/concat-vec
(shape->css-properties shape objects shape-wrapper-css-properties)
(shape->css-properties shape objects shape-wrapper-css-properties options)
(shape->wrapper-css-properties shape objects))
(format-css-properties options)))
@ -285,7 +286,7 @@ body {
([objects shape property options]
(-> shape
(shape->css-property objects property)
(shape->css-property objects property options)
(format-css-property options))))
(defn get-css-value
@ -293,18 +294,19 @@ body {
(get-css-value objects shape property nil))
([objects shape property options]
(when-let [prop (shape->css-property shape objects property)]
(when-let [prop (shape->css-property shape objects property options)]
(format-css-value prop options))))
(defn generate-style
([objects shapes]
(generate-style objects shapes nil))
([objects shapes options]
(dm/str
prelude
(->> shapes
(keep #(get-shape-css-selector % objects options))
(str/join "\n\n")))))
([objects root-shapes all-shapes]
(generate-style objects root-shapes all-shapes nil))
([objects root-shapes all-shapes options]
(let [options (assoc options :root-shapes (into #{} (map :id) root-shapes))]
(dm/str
prelude
(->> all-shapes
(keep #(get-shape-css-selector % objects options))
(str/join "\n\n"))))))
(defn shadow->css
[shadow]

101
frontend/src/app/util/code_gen/style_css_values.cljs
View file

@ -25,10 +25,10 @@
:image fill-image})
(defmulti get-value
(fn [property _shape _objects] property))
(fn [property _shape _objects _options] property))
(defmethod get-value :position
[_ shape objects]
[_ shape objects _]
(cond
(or (and (ctl/any-layout-immediate-child? objects shape)
(not (ctl/position-absolute? shape))
@ -65,15 +65,15 @@
(- shape-value parent-value))))
(defmethod get-value :left
[_ shape objects]
[_ shape objects _]
(get-shape-position shape objects :x))
(defmethod get-value :top
[_ shape objects]
[_ shape objects _]
(get-shape-position shape objects :y))
(defmethod get-value :flex
[_ shape objects]
[_ shape objects _]
(let [parent (cfh/get-parent objects (:id shape))]
(when (and (ctl/flex-layout-immediate-child? objects shape)
(or (and (contains? #{:row :row-reverse} (:layout-flex-dir parent))
@ -112,15 +112,26 @@
(get shape type))))
(defmethod get-value :width
[_ shape objects]
(get-shape-size shape objects :width))
[_ shape objects options]
(let [root? (contains? (:root-shapes options) (:id shape))]
(if (and root? (ctl/any-layout? shape))
:fill
(get-shape-size shape objects :width))))
(defmethod get-value :height
[_ shape objects]
(get-shape-size shape objects :height))
[_ shape objects options]
(let [root? (contains? (:root-shapes options) (:id shape))]
(when-not (and root? (ctl/any-layout? shape))
(get-shape-size shape objects :height))))
(defmethod get-value :flex-grow
[_ shape _ options]
(let [root? (contains? (:root-shapes options) (:id shape))]
(when (and root? (ctl/any-layout? shape))
1)))
(defmethod get-value :transform
[_ shape objects]
[_ shape objects _]
(if (cgc/svg-markup? shape)
(let [parent (get objects (:parent-id shape))
transform
@ -145,7 +156,7 @@
transform-str))))
(defmethod get-value :background
[_ {:keys [fills] :as shape} _]
[_ {:keys [fills] :as shape} _ _]
(let [single-fill? (= (count fills) 1)]
(when (and (not (cgc/svg-markup? shape)) (not (cfh/group-shape? shape)) single-fill?)
(fill->color (first fills)))))
@ -164,12 +175,12 @@
:width width})))
(defmethod get-value :border
[_ shape _]
[_ shape _ _]
(when-not (cgc/svg-markup? shape)
(get-stroke-data (first (:strokes shape)))))
(defmethod get-value :border-radius
[_ {:keys [rx r1 r2 r3 r4] :as shape} _]
[_ {:keys [rx r1 r2 r3 r4] :as shape} _ _]
(cond
(cfh/circle-shape? shape)
"50%"
@ -181,76 +192,76 @@
[r1 r2 r3 r4]))
(defmethod get-value :box-shadow
[_ shape _]
[_ shape _ _]
(when-not (cgc/svg-markup? shape)
(:shadow shape)))
(defmethod get-value :filter
[_ shape _]
[_ shape _ _]
(when-not (cgc/svg-markup? shape)
(get-in shape [:blur :value])))
(defmethod get-value :display
[_ shape _]
[_ shape _ _]
(cond
(:hidden shape) "none"
(ctl/flex-layout? shape) "flex"
(ctl/grid-layout? shape) "grid"))
(defmethod get-value :opacity
[_ shape _]
[_ shape _ _]
(when (< (:opacity shape) 1)
(:opacity shape)))
(defmethod get-value :overflow
[_ shape _]
[_ shape _ _]
(when (and (cfh/frame-shape? shape)
(not (cgc/svg-markup? shape))
(not (:show-content shape)))
"hidden"))
(defmethod get-value :flex-direction
[_ shape _]
[_ shape _ _]
(:layout-flex-dir shape))
(defmethod get-value :align-items
[_ shape _]
[_ shape _ _]
(:layout-align-items shape))
(defmethod get-value :align-content
[_ shape _]
[_ shape _ _]
(:layout-align-content shape))
(defmethod get-value :justify-items
[_ shape _]
[_ shape _ _]
(:layout-justify-items shape))
(defmethod get-value :justify-content
[_ shape _]
[_ shape _ _]
(:layout-justify-content shape))
(defmethod get-value :flex-wrap
[_ shape _]
[_ shape _ _]
(:layout-wrap-type shape))
(defmethod get-value :gap
[_ shape _]
[_ shape _ _]
(let [[g1 g2] (ctl/gaps shape)]
(when (and (= g1 g2) (or (not= g1 0) (not= g2 0)))
[g1])))
(defmethod get-value :row-gap
[_ shape _]
[_ shape _ _]
(let [[g1 g2] (ctl/gaps shape)]
(when (and (not= g1 g2) (not= g1 0)) [g1])))
(defmethod get-value :column-gap
[_ shape _]
[_ shape _ _]
(let [[g1 g2] (ctl/gaps shape)]
(when (and (not= g1 g2) (not= g2 0)) [g2])))
(defmethod get-value :padding
[_ {:keys [layout-padding]} _]
[_ {:keys [layout-padding]} _ _]
(when (some? layout-padding)
(let [default-padding {:p1 0 :p2 0 :p3 0 :p4 0}
{:keys [p1 p2 p3 p4]} (merge default-padding layout-padding)]
@ -258,11 +269,11 @@
[p1 p2 p3 p4]))))
(defmethod get-value :grid-template-rows
[_ shape _]
[_ shape _ _]
(:layout-grid-rows shape))
(defmethod get-value :grid-template-columns
[_ shape _]
[_ shape _ _]
(:layout-grid-columns shape))
(defn area-cell?
@ -270,7 +281,7 @@
(and (= position :area) (d/not-empty? area-name)))
(defmethod get-value :grid-template-areas
[_ shape _]
[_ shape _ _]
(when (and (ctl/grid-layout? shape)
(some area-cell? (vals (:layout-grid-cells shape))))
(let [result
@ -304,15 +315,15 @@
(get cell prop))))))
(defmethod get-value :grid-column
[_ shape objects]
[_ shape objects _]
(get-grid-coord shape objects :column :column-span))
(defmethod get-value :grid-row
[_ shape objects]
[_ shape objects _]
(get-grid-coord shape objects :row :row-span))
(defmethod get-value :grid-area
[_ shape objects]
[_ shape objects _]
(when (and (ctl/grid-layout-immediate-child? objects shape)
(not (ctl/position-absolute? shape)))
(let [parent (get objects (:parent-id shape))
@ -321,7 +332,7 @@
(str/replace (:area-name cell) " " "-")))))
(defmethod get-value :flex-shrink
[_ shape objects]
[_ shape objects _]
(when (and (ctl/flex-layout-immediate-child? objects shape)
(not (and (contains? #{:row :reverse-row} (:layout-flex-dir shape))
@ -337,7 +348,7 @@
0))
(defmethod get-value :margin
[_ {:keys [layout-item-margin] :as shape} objects]
[_ {:keys [layout-item-margin] :as shape} objects _]
(when (ctl/any-layout-immediate-child? objects shape)
(let [default-margin {:m1 0 :m2 0 :m3 0 :m4 0}
@ -346,7 +357,7 @@
[m1 m2 m3 m4]))))
(defmethod get-value :z-index
[_ {:keys [layout-item-z-index] :as shape} objects]
[_ {:keys [layout-item-z-index] :as shape} objects _]
(cond
(cfh/root-frame? shape)
0
@ -355,13 +366,13 @@
layout-item-z-index))
(defmethod get-value :max-height
[_ shape objects]
[_ shape objects _]
(cond
(ctl/any-layout-immediate-child? objects shape)
(:layout-item-max-h shape)))
(defmethod get-value :min-height
[_ shape objects]
[_ shape objects _]
(cond
(and (ctl/any-layout-immediate-child? objects shape) (some? (:layout-item-min-h shape)))
(:layout-item-min-h shape)
@ -370,13 +381,13 @@
(-> shape :selrect :height)))
(defmethod get-value :max-width
[_ shape objects]
[_ shape objects _]
(cond
(ctl/any-layout-immediate-child? objects shape)
(:layout-item-max-w shape)))
(defmethod get-value :min-width
[_ shape objects]
[_ shape objects _]
(cond
(and (ctl/any-layout-immediate-child? objects shape) (some? (:layout-item-min-w shape)))
(:layout-item-min-w shape)
@ -385,7 +396,7 @@
(-> shape :selrect :width)))
(defmethod get-value :align-self
[_ shape objects]
[_ shape objects _]
(cond
(ctl/flex-layout-immediate-child? objects shape)
(:layout-item-align-self shape)
@ -397,7 +408,7 @@
(when (not= align-self :auto) align-self))))
(defmethod get-value :justify-self
[_ shape objects]
[_ shape objects _]
(cond
(ctl/grid-layout-immediate-child? objects shape)
(let [parent (get objects (:parent-id shape))
@ -406,10 +417,10 @@
(when (not= justify-self :auto) justify-self))))
(defmethod get-value :grid-auto-flow
[_ shape _]
[_ shape _ _]
(when (and (ctl/grid-layout? shape) (= (:layout-grid-dir shape) :column))
"column"))
(defmethod get-value :default
[property shape _]
[property shape _ _]
(get shape property))