diff --git a/CHANGES.md b/CHANGES.md index 2c2f173c0..c3da69c9e 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -35,6 +35,7 @@ ### :bug: Bugs fixed +- Fix inconsistent representation of rectangles [Taiga #3977](https://tree.taiga.io/project/penpot/issue/3977) - Fix recent fonts info [Taiga #3953](https://tree.taiga.io/project/penpot/issue/3953) - Fix clipped elements affect boards and centering [Taiga #3666](https://tree.taiga.io/project/penpot/issue/3666) - Fix intro action in multi input [Taiga #3541](https://tree.taiga.io/project/penpot/issue/3541) diff --git a/common/src/app/common/path/shapes_to_path.cljc b/common/src/app/common/path/shapes_to_path.cljc index d4adbccdb..6c3916ba5 100644 --- a/common/src/app/common/path/shapes_to_path.cljc +++ b/common/src/app/common/path/shapes_to_path.cljc @@ -224,7 +224,11 @@ #_:else (rect->path shape)) ;; Apply the transforms that had the shape - transform (:transform shape) + transform + (cond-> (:transform shape (gmt/matrix)) + (:flip-x shape) (gmt/scale (gpt/point -1 1)) + (:flip-y shape) (gmt/scale (gpt/point 1 -1))) + new-content (cond-> new-content (some? transform) (gsp/transform-content (gmt/transform-in (gsc/center-shape shape) transform)))] diff --git a/common/src/app/common/types/shape/radius.cljc b/common/src/app/common/types/shape/radius.cljc index c93189e94..a93a8a927 100644 --- a/common/src/app/common/types/shape/radius.cljc +++ b/common/src/app/common/types/shape/radius.cljc @@ -87,11 +87,17 @@ (defn set-radius-4 [shape attr value] - (cond-> shape - (:rx shape) - (-> (dissoc :rx :rx) - (assoc :r1 0 :r2 0 :r3 0 :r4 0)) + (let [attr (cond->> attr + (:flip-x shape) + (get {:r1 :r2 :r2 :r1 :r3 :r4 :r4 :r3}) - :always - (assoc attr value))) + (:flip-y shape) + (get {:r1 :r4 :r2 :r3 :r3 :r2 :r4 :r1}))] + (cond-> shape + (:rx shape) + (-> (dissoc :rx :rx) + (assoc :r1 0 :r2 0 :r3 0 :r4 0)) + + :always + (assoc attr value)))) diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs index 79d84a767..dd197446f 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs @@ -19,7 +19,7 @@ [app.main.ui.icons :as i] [app.util.dom :as dom] [app.util.i18n :as i18n :refer [tr]] - [clojure.set :refer [union]] + [clojure.set :refer [rename-keys union]] [rumext.alpha :as mf])) (def measure-attrs @@ -46,10 +46,26 @@ :svg-raw #{:size :position :rotation} :text #{:size :position :rotation}}) +(defn select-measure-keys + "Consider some shapes can be drawn from bottom to top or from left to right" + [shape] + (let [shape (cond + (and (:flip-x shape) (:flip-y shape)) + (rename-keys shape {:r1 :r3 :r2 :r4 :r3 :r1 :r4 :r2}) + + (:flip-x shape) + (rename-keys shape {:r1 :r2 :r2 :r1 :r3 :r4 :r4 :r3}) + + (:flip-y shape) + (rename-keys shape {:r1 :r4 :r2 :r3 :r3 :r2 :r4 :r1}) + + :else + shape)] + (select-keys shape measure-attrs))) + ;; -- User/drawing coords (mf/defc measures-menu [{:keys [ids ids-with-children values type all-types shape] :as props}] - (let [options (if (= type :multiple) (reduce #(union %1 %2) (map #(get type->options %) all-types)) (get type->options type)) @@ -221,7 +237,7 @@ (st/emit! (dch/update-shapes ids (fn [shape] (assoc shape :hide-in-viewer (not value)))))))) select-all #(-> % (dom/get-target) (.select))] - + (mf/use-layout-effect (mf/deps radius-mode @radius-multi?) (fn [] diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/shapes/multiple.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/shapes/multiple.cljs index 782e33a56..e3edc9d2e 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/shapes/multiple.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/shapes/multiple.cljs @@ -21,11 +21,11 @@ [app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-attrs layer-menu]] [app.main.ui.workspace.sidebar.options.menus.layout :refer [layout-attrs layout-menu]] [app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]] - [app.main.ui.workspace.sidebar.options.menus.measures :refer [measure-attrs measures-menu]] + [app.main.ui.workspace.sidebar.options.menus.measures :refer [select-measure-keys measure-attrs measures-menu]] [app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-attrs shadow-menu]] [app.main.ui.workspace.sidebar.options.menus.stroke :refer [stroke-attrs stroke-menu]] [app.main.ui.workspace.sidebar.options.menus.text :as ot] - [rumext.alpha :as mf])) + [rumext.alpha :as mf])) ;; Define how to read each kind of attribute depending on the shape type: ;; - shape: read the attribute directly from the shape. @@ -197,8 +197,10 @@ :shape (let [;; Get the editable attrs from the shape, ensuring that all attributes ;; are present, with value nil if they are not present in the shape. shape-values (merge - (into {} (map #(vector % nil)) editable-attrs) - (select-keys shape editable-attrs))] + (into {} (map #(vector % nil)) editable-attrs) + (cond + (= attr-group :measure) (select-measure-keys shape) + :else (select-keys shape editable-attrs)))] [(conj ids id) (merge-attrs values shape-values)]) diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/shapes/rect.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/shapes/rect.cljs index 49773a069..723050df7 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/options/shapes/rect.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/options/shapes/rect.cljs @@ -12,7 +12,7 @@ [app.main.ui.workspace.sidebar.options.menus.fill :refer [fill-attrs fill-menu]] [app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-attrs layer-menu]] [app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]] - [app.main.ui.workspace.sidebar.options.menus.measures :refer [measure-attrs measures-menu]] + [app.main.ui.workspace.sidebar.options.menus.measures :refer [select-measure-keys measures-menu]] [app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-menu]] [app.main.ui.workspace.sidebar.options.menus.stroke :refer [stroke-attrs stroke-menu]] [app.main.ui.workspace.sidebar.options.menus.svg-attrs :refer [svg-attrs-menu]] @@ -23,7 +23,7 @@ [{:keys [shape] :as props}] (let [ids [(:id shape)] type (:type shape) - measure-values (select-keys shape measure-attrs) + measure-values (select-measure-keys shape) layer-values (select-keys shape layer-attrs) constraint-values (select-keys shape constraint-attrs) fill-values (select-keys shape fill-attrs)