mirror of
https://github.com/penpot/penpot.git
synced 2025-01-06 14:50:20 -05:00
Resolve merge conflicts in context_menu.cljs
This commit is contained in:
Akshay Gupta
commit
88d3fc234d
1 changed files with 59 additions and 44 deletions
|
|
@ -20,6 +20,7 @@
|
|||
[app.main.ui.workspace.context-menu :refer [menu-entry prevent-default]]
|
||||
[app.main.ui.workspace.tokens.core :as wtc]
|
||||
[app.util.dom :as dom]
|
||||
[clojure.set :as set]
|
||||
[okulary.core :as l]
|
||||
[rumext.v2 :as mf]))
|
||||
|
||||
|
|
@ -35,12 +36,12 @@
|
|||
{:reg-objects? true
|
||||
:attrs [:rx :ry :r1 :r2 :r3 :r4]})))
|
||||
|
||||
(defn apply-border-radius-token [{:keys [token-id token-type-props selected-shapes]} attribute]
|
||||
(defn apply-border-radius-token [{:keys [token-id token-type-props selected-shapes]} attributes]
|
||||
(let [token (dt/get-token-data-from-token-id token-id)
|
||||
updated-token-type-props (if (#{:r1 :r2 :r3 :r4} attribute)
|
||||
updated-token-type-props (if (set/superset? #{:r1 :r2 :r3 :r4} attributes)
|
||||
(assoc token-type-props
|
||||
:on-update-shape update-shape-radius-single-corner
|
||||
:attributes #{attribute})
|
||||
:attributes attributes)
|
||||
token-type-props)]
|
||||
(wtc/on-apply-token {:token token
|
||||
:token-type-props updated-token-type-props
|
||||
|
|
@ -54,12 +55,12 @@
|
|||
(st/emit! (dwsl/update-layout shape-ids {:layout-padding (zipmap attributes (repeat value))}))))
|
||||
|
||||
|
||||
(defn apply-spacing-token [{:keys [token-id token-type-props selected-shapes]} attribute]
|
||||
(defn apply-spacing-token [{:keys [token-id token-type-props selected-shapes]} attributes]
|
||||
(let [token (dt/get-token-data-from-token-id token-id)
|
||||
attribute (set attribute)
|
||||
attributes (set attributes)
|
||||
updated-token-type-props (assoc token-type-props
|
||||
:on-update-shape update-layout-spacing
|
||||
:attributes attribute)]
|
||||
:attributes attributes)]
|
||||
(wtc/on-apply-token {:token token
|
||||
:token-type-props updated-token-type-props
|
||||
:selected-shapes selected-shapes})))
|
||||
|
|
@ -70,53 +71,61 @@
|
|||
(defn update-layout-sizing-limits [value shape-ids attributes]
|
||||
(st/emit! (dwsl/update-layout-child shape-ids {(first attributes) value})))
|
||||
|
||||
(defn apply-sizing-token [{:keys [token-id token-type-props selected-shapes]} attribute]
|
||||
(defn apply-sizing-token [{:keys [token-id token-type-props selected-shapes]} attributes]
|
||||
(let [token (dt/get-token-data-from-token-id token-id)
|
||||
updated-token-type-props (cond
|
||||
(#{:width :height} attribute)
|
||||
(set/superset? #{:width :height} attributes)
|
||||
(assoc token-type-props
|
||||
:on-update-shape update-shape-dimensions
|
||||
:attributes #{attribute})
|
||||
:attributes attributes)
|
||||
|
||||
(#{:layout-item-min-w :layout-item-max-w
|
||||
:layout-item-min-h :layout-item-max-h} attribute)
|
||||
(set/superset? {:layout-item-min-w :layout-item-max-w
|
||||
:layout-item-min-h :layout-item-max-h} attributes)
|
||||
(assoc token-type-props
|
||||
:on-update-shape update-layout-sizing-limits
|
||||
:attributes #{attribute}))]
|
||||
:attributes attributes))]
|
||||
(wtc/on-apply-token {:token token
|
||||
:token-type-props updated-token-type-props
|
||||
:selected-shapes selected-shapes})))
|
||||
|
||||
(defn additional-actions [{:keys [token-id token-type selected-shapes] :as context-data}]
|
||||
(let [attributes->actions (fn [update-fn coll]
|
||||
(for [{:keys [attributes] :as item} coll]
|
||||
(let [selected? (wtc/tokens-applied? {:id token-id} selected-shapes attributes)]
|
||||
(assoc item
|
||||
:action #(update-fn context-data attributes)
|
||||
:selected? selected?))))]
|
||||
(case token-type
|
||||
:border-radius (attributes->actions
|
||||
apply-border-radius-token
|
||||
[{:title "All" :attributes #{:r1 :r2 :r3 :r4}}
|
||||
{:title "Top Left" :attributes #{:r1}}
|
||||
{:title "Top Right" :attributes #{:r2}}
|
||||
{:title "Bottom Right" :attributes #{:r3}}
|
||||
{:title "Bottom Left" :attributes #{:r4}}])
|
||||
:spacing (attributes->actions
|
||||
apply-spacing-token
|
||||
[{:title "All" :attributes #{:p1 :p2 :p3 :p4}}
|
||||
{:title "Column Gap" :attributes #{:column-gap}}
|
||||
{:title "Vertical padding" :attributes #{:p1 :p3}}
|
||||
{:title "Horizontal padding" :attributes #{:p2 :p4}}
|
||||
{:title "Row Gap" :attributes #{:row-gap}}
|
||||
{:title "Top" :attributes #{:p1}}
|
||||
{:title "Right" :attributes #{:p2}}
|
||||
{:title "Bottom" :attributes #{:p3}}
|
||||
{:title "Left" :attributes #{:p4}}])
|
||||
|
||||
(defn additional-actions [{:keys [token-type] :as context-data}]
|
||||
(case token-type
|
||||
:border-radius (let [action #(apply-border-radius-token context-data %)]
|
||||
[{:title "All" :action #(action :all)}
|
||||
{:title "Top Left" :action #(action :r1)}
|
||||
{:title "Top Right" :action #(action :r2)}
|
||||
{:title "Bottom Right" :action #(action :r3)}
|
||||
{:title "Bottom Left" :action #(action :r4)}])
|
||||
:spacing (let [action #(apply-spacing-token context-data %)]
|
||||
[{:title "All" :action #(action #{:p1 :p2 :p3 :p4})}
|
||||
{:title "Column Gap" :action #(action #{:column-gap})}
|
||||
{:title "Vertical padding" :action #(action #{:p1 :p3})}
|
||||
{:title "Horizontal padding" :action #(action #{:p2 :p4})}
|
||||
{:title "Row Gap" :action #(action #{:row-gap})}
|
||||
{:title "Top" :action #(action #{:p1})}
|
||||
{:title "Right" :action #(action #{:p2})}
|
||||
{:title "Bottom" :action #(action #{:p3})}
|
||||
{:title "Left" :action #(action #{:p4})}])
|
||||
:sizing (attributes->actions
|
||||
apply-sizing-token
|
||||
[{:title "All" :attributes #{:width :height :layout-item-min-w :layout-item-max-w :layout-item-min-h :layout-item-max-h}}
|
||||
{:title "Width" :attributes #{:width}}
|
||||
{:title "Height" :attributes #{:height}}
|
||||
{:title "Min width" :attributes #{:layout-item-min-w}}
|
||||
{:title "Max width" :attributes #{:layout-item-max-w}}
|
||||
{:title "Min height" :attributes #{:layout-item-min-h}}
|
||||
{:title "Max height" :attributes #{:layout-item-max-h}}])
|
||||
|
||||
:sizing (let [action #(apply-sizing-token context-data %)]
|
||||
[{:title "All" :action #(action :all)}
|
||||
{:title "Width" :action #(action :width)}
|
||||
{:title "Height" :action #(action :height)}
|
||||
{:title "Min width" :action #(action :layout-item-min-w)}
|
||||
{:title "Max width" :action #(action :layout-item-max-w)}
|
||||
{:title "Min height" :action #(action :layout-item-min-h)}
|
||||
{:title "Max height" :action #(action :layout-item-max-h)}])
|
||||
|
||||
[]))
|
||||
[])))
|
||||
|
||||
(defn generate-menu-entries [{:keys [token-id token-type-props token-type selected-shapes] :as context-data}]
|
||||
(let [{:keys [modal]} token-type-props
|
||||
|
|
@ -137,10 +146,16 @@
|
|||
all-actions))
|
||||
|
||||
(mf/defc token-pill-context-menu
|
||||
[{:keys [token-id token-type-props token-type selected-shapes] :as context-data}]
|
||||
[context-data]
|
||||
(let [menu-entries (generate-menu-entries context-data)]
|
||||
(for [[index entry] (d/enumerate menu-entries)]
|
||||
[:& menu-entry {:title (:title entry) :on-click (:action entry) :key index}])))
|
||||
(for [[index {:keys [title action selected?]}] (d/enumerate menu-entries)]
|
||||
[:& menu-entry {:key index
|
||||
:title title
|
||||
:on-click action
|
||||
;; TODO: Allow selected items wihtout an icon for the context menu
|
||||
:icon (mf/html [:div {:class (stl/css-case :empty-icon true
|
||||
:hidden-icon (not selected?))}])
|
||||
:selected? selected?}])))
|
||||
|
||||
(mf/defc token-context-menu
|
||||
[]
|
||||
|
|
@ -176,4 +191,4 @@
|
|||
[:& token-pill-context-menu {:token-id (:token-id mdata)
|
||||
:token-type-props (:token-type-props mdata)
|
||||
:token-type (:token-type mdata)
|
||||
:selected-shapes selected-shapes}]])]]))
|
||||
:selected-shapes selected-shapes}]])]]))
|
||||
|
|
|
|||
Loading…
Reference in a new issue