Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-04-08 13:01:24 -05:00
Code Issues Activity

💄 Format frontend code

Browse source
This commit is contained in:
Andrey Antukh 2024-01-05 14:23:30 +01:00 • committed by Alonso Torres
parent b6ecc8b1be
commit 833871df65
150 changed files with 1735 additions and 1770 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.cljfmt.edn
View file

@ -3,6 +3,7 @@
:remove-surrounding-whitespace? true
:remove-consecutive-blank-lines? false
:extra-indents {rumext.v2/fnc [[:inner 0]]
cljs.test/async [[:inner 0]]
promesa.exec/thread [[:inner 0]]
specify! [[:inner 0] [:inner 1]]}
}

6
frontend/src/app/libs/file_builder.cljs
View file

@ -133,8 +133,8 @@
(rx/reduce conj [])
(rx/with-latest-from files-stream)
(rx/merge-map (fn [[data _]]
(->> (uz/compress-files data)
(rx/map #(vector file %)))))))))
(->> (uz/compress-files data)
(rx/map #(vector file %)))))))))
(deftype File [^:mutable file]
Object
@ -263,4 +263,4 @@
(File. (fb/create-file name)))
(defn exports []
#js { :createFile create-file-export })
#js {:createFile create-file-export})

2
frontend/src/app/libs/render.cljs
View file

@ -22,7 +22,7 @@
(fn [resolve reject]
(->> (r/render-page data)
(rx/take 1)
(rx/subs! resolve reject))) )))
(rx/subs! resolve reject))))))
(defn exports []
#js {:renderPage render-page-export})

82
frontend/src/app/main/data/comments.cljs
View file

@ -171,14 +171,14 @@
ptk/WatchEvent
(watch [_ state _]
(let [share-id (-> state :viewer-local :share-id)]
(->> (rp/cmd! :update-comment-thread {:id id :is-resolved is-resolved :share-id share-id})
(rx/catch (fn [{:keys [type code] :as cause}]
(if (and (= type :restriction)
(= code :max-quote-reached))
(rx/throw cause)
(rx/throw {:type :comment-error}))))
(rx/ignore))))))
(let [share-id (-> state :viewer-local :share-id)]
(->> (rp/cmd! :update-comment-thread {:id id :is-resolved is-resolved :share-id share-id})
(rx/catch (fn [{:keys [type code] :as cause}]
(if (and (= type :restriction)
(= code :max-quote-reached))
(rx/throw cause)
(rx/throw {:type :comment-error}))))
(rx/ignore))))))
(defn add-comment
[thread content]
@ -196,16 +196,16 @@
(ptk/reify ::create-comment
ptk/WatchEvent
(watch [_ state _]
(let [share-id (-> state :viewer-local :share-id)]
(rx/concat
(->> (rp/cmd! :create-comment {:thread-id (:id thread) :content content :share-id share-id})
(rx/map #(partial created %))
(rx/catch (fn [{:keys [type code] :as cause}]
(if (and (= type :restriction)
(= code :max-quote-reached))
(rx/throw cause)
(rx/throw {:type :comment-error})))))
(rx/of (refresh-comment-thread thread))))))))
(let [share-id (-> state :viewer-local :share-id)]
(rx/concat
(->> (rp/cmd! :create-comment {:thread-id (:id thread) :content content :share-id share-id})
(rx/map #(partial created %))
(rx/catch (fn [{:keys [type code] :as cause}]
(if (and (= type :restriction)
(= code :max-quote-reached))
(rx/throw cause)
(rx/throw {:type :comment-error})))))
(rx/of (refresh-comment-thread thread))))))))
(defn update-comment
[{:keys [id content thread-id] :as comment}]
@ -309,14 +309,14 @@
(->
(assoc-in (conj path :position) (:position comment-thread))
(assoc-in (conj path :frame-id) (:frame-id comment-thread))))))
(fetched [[users comments] state]
(let [pages (-> (get-in state [:workspace-data :pages])
set)
comments (filter #(contains? pages (:page-id %)) comments)
state (-> state
(assoc :comment-threads (d/index-by :id comments))
(update :current-file-comments-users merge (d/index-by :id users)))]
(reduce set-comment-threds state comments)))]
(fetched [[users comments] state]
(let [pages (-> (get-in state [:workspace-data :pages])
set)
comments (filter #(contains? pages (:page-id %)) comments)
state (-> state
(assoc :comment-threads (d/index-by :id comments))
(update :current-file-comments-users merge (d/index-by :id users)))]
(reduce set-comment-threds state comments)))]
(ptk/reify ::retrieve-comment-threads
ptk/WatchEvent
@ -491,23 +491,23 @@
([thread]
(update-comment-thread-frame thread uuid/zero))
([thread frame-id]
(dm/assert!
"expected valid comment thread"
(check-comment-thread! thread))
([thread frame-id]
(dm/assert!
"expected valid comment thread"
(check-comment-thread! thread))
(ptk/reify ::update-comment-thread-frame
ptk/UpdateEvent
(update [_ state]
(let [thread-id (:id thread)]
(assoc-in state [:comment-threads thread-id :frame-id] frame-id)))
(ptk/reify ::update-comment-thread-frame
ptk/UpdateEvent
(update [_ state]
(let [thread-id (:id thread)]
(assoc-in state [:comment-threads thread-id :frame-id] frame-id)))
ptk/WatchEvent
(watch [_ _ _]
(let [thread-id (:id thread)]
(->> (rp/cmd! :update-comment-thread-frame {:id thread-id :frame-id frame-id})
(rx/catch #(rx/throw {:type :comment-error :code :update-comment-thread-frame}))
(rx/ignore)))))))
ptk/WatchEvent
(watch [_ _ _]
(let [thread-id (:id thread)]
(->> (rp/cmd! :update-comment-thread-frame {:id thread-id :frame-id frame-id})
(rx/catch #(rx/throw {:type :comment-error :code :update-comment-thread-frame}))
(rx/ignore)))))))
(defn detach-comment-thread
"Detach comment threads that are inside a frame when that frame is deleted"

22
frontend/src/app/main/data/dashboard.cljs
View file

@ -306,8 +306,8 @@
(ptk/reify ::fetch-builtin-templates
ptk/WatchEvent
(watch [_ _ _]
(->> (rp/cmd! :get-builtin-templates)
(rx/map builtin-templates-fetched)))))
(->> (rp/cmd! :get-builtin-templates)
(rx/map builtin-templates-fetched)))))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Data Selection
@ -320,7 +320,7 @@
(update [_ state]
(update state :dashboard-local
assoc :selected-files #{}
:selected-project nil))))
:selected-project nil))))
(defn toggle-file-select
[{:keys [id project-id] :as file}]
@ -377,10 +377,10 @@
:or {on-success identity
on-error rx/throw}} (meta params)
features (features/get-enabled-features state)]
params {:name name
:emails #{emails}
:role role
:features features}
params {:name name
:emails #{emails}
:role role
:features features}
(->> (rp/cmd! :create-team-with-invitations params)
(rx/tap on-success)
(rx/map team-created)
@ -817,7 +817,7 @@
(d/update-in-when [:dashboard-files id :is-shared] (constantly is-shared))
(d/update-in-when [:dashboard-recent-files id :is-shared] (constantly is-shared))
(cond->
(not is-shared)
(not is-shared)
(d/update-when :dashboard-shared-files dissoc id))))
ptk/WatchEvent
@ -1010,9 +1010,9 @@
(let [team-id (:current-team-id state)]
(if (empty? term)
(do
(dom/focus! (dom/get-element "search-input"))
(rx/of (rt/nav :dashboard-search
{:team-id team-id})))
(dom/focus! (dom/get-element "search-input"))
(rx/of (rt/nav :dashboard-search
{:team-id team-id})))
(rx/of (rt/nav :dashboard-search
{:team-id team-id}
{:search-term term})))))

20
frontend/src/app/main/data/messages.cljs
View file

@ -59,16 +59,16 @@
ptk/WatchEvent
(watch [_ _ stream]
(rx/merge
(let [stoper (rx/filter (ptk/type? ::hide) stream)]
(->> stream
(rx/filter (ptk/type? :app.util.router/navigate))
(rx/map (constantly hide))
(rx/take-until stoper)))
(when (:timeout data)
(let [stoper (rx/filter (ptk/type? ::show) stream)]
(->> (rx/of hide)
(rx/delay (:timeout data))
(rx/take-until stoper))))))))
(let [stoper (rx/filter (ptk/type? ::hide) stream)]
(->> stream
(rx/filter (ptk/type? :app.util.router/navigate))
(rx/map (constantly hide))
(rx/take-until stoper)))
(when (:timeout data)
(let [stoper (rx/filter (ptk/type? ::show) stream)]
(->> (rx/of hide)
(rx/delay (:timeout data))
(rx/take-until stoper))))))))
(def hide
(ptk/reify ::hide

4
frontend/src/app/main/data/users.cljs
View file

@ -131,8 +131,8 @@
(when profile
(swap! storage assoc :profile profile)
(i18n/set-locale! (:lang profile))
(when (not= previous-email email)
(swap! storage dissoc ::current-team-id)))))))
(when (not= previous-email email)
(swap! storage dissoc ::current-team-id)))))))
(defn fetch-profile
[]

28
frontend/src/app/main/data/viewer.cljs
View file

@ -66,10 +66,10 @@
(-> state
(assoc :current-file-id file-id)
(update :viewer-local
(fn [lstate]
(if (nil? lstate)
default-local-state
lstate)))
(fn [lstate]
(if (nil? lstate)
default-local-state
lstate)))
(assoc-in [:viewer-local :share-id] share-id)
(assoc-in [:viewer-local :interactions-show?] interactions-show?)))
@ -202,10 +202,10 @@
"fill" zoom-to-fill
nil))
(rx/of
(cond
(some? frame-id) (go-to-frame (uuid frame-id))
(some? index) (go-to-frame-by-index index)
:else (go-to-frame-auto)))))))))
(cond
(some? frame-id) (go-to-frame (uuid frame-id))
(some? index) (go-to-frame-by-index index)
:else (go-to-frame-auto)))))))))
(defn fetch-comment-threads
[{:keys [file-id page-id share-id] :as params}]
@ -297,9 +297,9 @@
ptk/UpdateEvent
(update [_ state]
(let [srect (as-> (get-in state [:route :query-params :page-id]) %
(get-in state [:viewer :pages % :frames])
(nth % (get-in state [:route :query-params :index]))
(get % :selrect))
(get-in state [:viewer :pages % :frames])
(nth % (get-in state [:route :query-params :index]))
(get % :selrect))
orig-size (get-in state [:viewer-local :viewport-size])
wdiff (/ (:width orig-size) (:width srect))
hdiff (/ (:height orig-size) (:height srect))
@ -514,9 +514,9 @@
(some? animation)
(assoc-in [:viewer-animations (:id frame)]
{:kind :go-to-frame
:orig-frame-id (:id frame)
:animation animation}))))
{:kind :go-to-frame
:orig-frame-id (:id frame)
:animation animation}))))
ptk/WatchEvent
(watch [_ state _]

69
frontend/src/app/main/data/workspace.cljs
View file

@ -316,8 +316,8 @@
(rx/take 1)
(rx/map #(go-to-component (uuid/uuid component-id))))))
(rx/take-until
(rx/filter (ptk/type? ::fetch-bundle) stream))))))
(rx/take-until
(rx/filter (ptk/type? ::fetch-bundle) stream))))))
(defn initialize-file
[project-id file-id]
@ -1038,12 +1038,12 @@
shapes-to-select
(->> selected
(reduce
(fn [result shape-id]
(let [parent-id (dm/get-in objects [shape-id :parent-id])]
(if (and (some? parent-id) (not= parent-id uuid/zero))
(conj result parent-id)
(conj result shape-id))))
(d/ordered-set)))]
(fn [result shape-id]
(let [parent-id (dm/get-in objects [shape-id :parent-id])]
(if (and (some? parent-id) (not= parent-id uuid/zero))
(conj result parent-id)
(conj result shape-id))))
(d/ordered-set)))]
(rx/of (dws/select-shapes shapes-to-select))))))
;; --- Change Page Order (D&D Ordering)
@ -1470,17 +1470,17 @@
no-bool-shapes? (->> all-selected (some (comp #{:frame :text} :type)))]
(if (and (some? shape) (not (contains? selected (:id shape))))
(rx/concat
(rx/of (dws/select-shape (:id shape)))
(rx/of (show-shape-context-menu params)))
(rx/of (show-context-menu
(-> params
(assoc
:kind :shape
:disable-booleans? (or no-bool-shapes? not-group-like?)
:disable-flatten? no-bool-shapes?
:selected (conj selected (:id shape)))))))))))
(if (and (some? shape) (not (contains? selected (:id shape))))
(rx/concat
(rx/of (dws/select-shape (:id shape)))
(rx/of (show-shape-context-menu params)))
(rx/of (show-context-menu
(-> params
(assoc
:kind :shape
:disable-booleans? (or no-bool-shapes? not-group-like?)
:disable-flatten? no-bool-shapes?
:selected (conj selected (:id shape)))))))))))
(defn show-page-item-context-menu
[{:keys [position page] :as params}]
@ -1488,8 +1488,8 @@
(ptk/reify ::show-page-item-context-menu
ptk/WatchEvent
(watch [_ _ _]
(rx/of (show-context-menu
(-> params (assoc :kind :page :selected (:id page))))))))
(rx/of (show-context-menu
(-> params (assoc :kind :page :selected (:id page))))))))
(defn show-track-context-menu
[{:keys [grid-id type index] :as params}]
@ -1902,7 +1902,7 @@
;; - Align it to the limits on the x and y axis
;; - Respect the distance of the object to the right and bottom in the original frame
(gpt/point paste-x paste-y))]
[frame-id frame-id delta (dec (count (:shapes selected-frame-obj )))]))
[frame-id frame-id delta (dec (count (:shapes selected-frame-obj)))]))
(empty? page-selected)
(let [frame-id (ctst/top-nested-frame page-objects position)
@ -1953,8 +1953,7 @@
(ptk/reify ::paste-shapes
ptk/WatchEvent
(watch [it state _]
(let [
file-id (:current-file-id state)
(let [file-id (:current-file-id state)
page (wsh/lookup-page state)
media-idx (->> (:media pdata)
@ -2216,23 +2215,23 @@
ptk/WatchEvent
(watch [it state _]
(let [data (get state :workspace-data)
(let [data (get state :workspace-data)
update-fn
(fn [component]
update-fn
(fn [component]
;; NOTE: we need to ensure the component exists,
;; because there are small possibilities of race
;; conditions with component deletion.
(when component
(if (nil? annotation)
(dissoc component :annotation)
(assoc component :annotation annotation))))
(when component
(if (nil? annotation)
(dissoc component :annotation)
(assoc component :annotation annotation))))
changes (-> (pcb/empty-changes it)
(pcb/with-library-data data)
(pcb/update-component id update-fn))]
changes (-> (pcb/empty-changes it)
(pcb/with-library-data data)
(pcb/update-component id update-fn))]
(rx/of (dch/commit-changes changes))))))
(rx/of (dch/commit-changes changes))))))
(defn set-annotations-expanded
[expanded?]

12
frontend/src/app/main/data/workspace/collapse.cljs
View file

@ -19,12 +19,12 @@
(update [_ state]
(let [expand-fn (fn [expanded]
(merge expanded
(->> ids
(map #(cfh/get-parent-ids objects %))
flatten
(remove #(= % uuid/zero))
(map (fn [id] {id true}))
(into {}))))]
(->> ids
(map #(cfh/get-parent-ids objects %))
flatten
(remove #(= % uuid/zero))
(map (fn [id] {id true}))
(into {}))))]
(update-in state [:workspace-local :expanded] expand-fn)))))

64
frontend/src/app/main/data/workspace/colors.cljs
View file

@ -332,9 +332,9 @@
(ptk/reify ::reorder-strokes
ptk/WatchEvent
(watch [_ _ _]
(rx/of (dch/update-shapes
ids
#(swap-attrs % :strokes index new-index))))))
(rx/of (dch/update-shapes
ids
#(swap-attrs % :strokes index new-index))))))
(defn picker-for-selected-shape
[]
@ -529,9 +529,9 @@
ptk/UpdateEvent
(update [_ state]
(update state :colorpicker
(fn [state]
(-> state
(assoc :type tab)))))))
(fn [state]
(-> state
(assoc :type tab)))))))
(defn finalize-colorpicker
[]
@ -622,10 +622,10 @@
ptk/UpdateEvent
(update [_ state]
(update state :colorpicker
(fn [state]
(-> state
(assoc :type :color)
(dissoc :editing-stop :stops :gradient)))))))
(fn [state]
(-> state
(assoc :type :color)
(dissoc :editing-stop :stops :gradient)))))))
(defn activate-colorpicker-gradient
[type]
@ -642,13 +642,13 @@
(d/dissoc-in [:current-color :image])
(cond-> (not (:stops state))
(assoc :editing-stop 0
:stops [(-> color
(assoc :offset 0)
(materialize-color-components))
(-> color
(assoc :alpha 0)
(assoc :offset 1)
(materialize-color-components))])))))))))
:stops [(-> color
(assoc :offset 0)
(materialize-color-components))
(-> color
(assoc :alpha 0)
(assoc :offset 1)
(materialize-color-components))])))))))))
(defn activate-colorpicker-image
[]
@ -656,10 +656,10 @@
ptk/UpdateEvent
(update [_ state]
(update state :colorpicker
(fn [state]
(-> state
(assoc :type :image)
(dissoc :editing-stop :stops :gradient)))))))
(fn [state]
(-> state
(assoc :type :image)
(dissoc :editing-stop :stops :gradient)))))))
(defn select-color
[position add-color]
@ -671,13 +671,13 @@
shape (first shapes)
fills (if (cfh/text-shape? shape)
(:fills (dwt/current-text-values
{:editor-state (dm/get-in state [:workspace-editor-state (:id shape)])
:shape shape
:attrs (conj dwt/text-fill-attrs :fills)}))
{:editor-state (dm/get-in state [:workspace-editor-state (:id shape)])
:shape shape
:attrs (conj dwt/text-fill-attrs :fills)}))
(:fills shape))
fill (first fills)
single? (and (= 1 (count selected))
(= 1 (count fills)))
(= 1 (count fills)))
data (if single?
(d/without-nils {:color (:fill-color fill)
:opacity (:fill-opacity fill)
@ -685,13 +685,13 @@
{:color "#406280"
:opacity 1})]
(rx/of (md/show :colorpicker
{:x (:x position)
:y (:y position)
:on-accept add-color
:data data
:position :right})
(ptk/event ::ev/event {::ev/name "add-asset-to-library"
:asset-type "color"}))))))
{:x (:x position)
:y (:y position)
:on-accept add-color
:data data
:position :right})
(ptk/event ::ev/event {::ev/name "add-asset-to-library"
:asset-type "color"}))))))
(defn get-active-color-tab
[]

2
frontend/src/app/main/data/workspace/comments.cljs
View file

@ -42,7 +42,7 @@
(rx/filter mse/mouse-click-event?)
(rx/switch-map #(rx/take 1 ms/mouse-position))
(rx/with-latest-from ms/keyboard-space)
(rx/filter (fn [[_ space]] (not space)) )
(rx/filter (fn [[_ space]] (not space)))
(rx/map first)
(rx/map handle-comment-layer-click)
(rx/take-until stoper))

4
frontend/src/app/main/data/workspace/common.cljs
View file

@ -169,7 +169,7 @@
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn toggle-toolbar-visibility
[]
[]
(ptk/reify ::toggle-toolbar-visibility
ptk/UpdateEvent
(update [_ state]
@ -180,7 +180,7 @@
(ptk/reify ::hide-toolbar
ptk/UpdateEvent
(update [_ state]
(assoc-in state [:workspace-local :hide-toolbar] true))))
(assoc-in state [:workspace-local :hide-toolbar] true))))
(defn show-toolbar
[]

2
frontend/src/app/main/data/workspace/drawing.cljs
View file

@ -82,7 +82,7 @@
(rx/merge
(rx/of (handle-drawing type))
(->> stream
(rx/filter (ptk/type? ::common/handle-finish-drawing) )
(rx/filter (ptk/type? ::common/handle-finish-drawing))
(rx/take 1)
(rx/map #(fn [state] (update state :workspace-drawing dissoc :lock)))))))))))

62
frontend/src/app/main/data/workspace/fix_deleted_fonts.cljs
View file

@ -25,8 +25,8 @@
[node]
(let [fonts (deref fonts/fontsdb)]
(and
(some? (:font-family node))
(nil? (get fonts (:font-id node))))))
(some? (:font-family node))
(nil? (get fonts (:font-id node))))))
(defn calculate-alternative-font-id
[value]
@ -66,9 +66,9 @@
(defn fix-deleted-font-component
[component]
(update component
:objects
(fn [objects]
(d/mapm #(fix-deleted-font-shape %2) objects))))
:objects
(fn [objects]
(d/mapm #(fix-deleted-font-shape %2) objects))))
(defn fix-deleted-font-typography
[typography]
@ -84,8 +84,8 @@
(let [objects (wsh/lookup-page-objects state)
ids (into #{}
(comp (filter should-fix-deleted-font-shape?) (map :id))
(vals objects))
(comp (filter should-fix-deleted-font-shape?) (map :id))
(vals objects))
components (->> (wsh/lookup-local-components state)
(vals)
@ -93,11 +93,11 @@
component-changes
(into []
(map (fn [component]
{:type :mod-component
:id (:id component)
:objects (-> (fix-deleted-font-component component) :objects)}))
components)
(map (fn [component]
{:type :mod-component
:id (:id component)
:objects (-> (fix-deleted-font-component component) :objects)}))
components)
typographies (->> (get-in state [:workspace-data :typographies])
(vals)
@ -105,25 +105,25 @@
typography-changes
(into []
(map (fn [typography]
{:type :mod-typography
:typography (fix-deleted-font-typography typography)}))
typographies)]
(map (fn [typography]
{:type :mod-typography
:typography (fix-deleted-font-typography typography)}))
typographies)]
(rx/concat
(rx/of (dch/update-shapes ids #(fix-deleted-font-shape %) {:reg-objects? false
:save-undo? false
:ignore-tree true}))
(if (empty? component-changes)
(rx/empty)
(rx/of (dch/commit-changes {:origin it
:redo-changes component-changes
:undo-changes []
:save-undo? false})))
(rx/of (dch/update-shapes ids #(fix-deleted-font-shape %) {:reg-objects? false
:save-undo? false
:ignore-tree true}))
(if (empty? component-changes)
(rx/empty)
(rx/of (dch/commit-changes {:origin it
:redo-changes component-changes
:undo-changes []
:save-undo? false})))
(if (empty? typography-changes)
(rx/empty)
(rx/of (dch/commit-changes {:origin it
:redo-changes typography-changes
:undo-changes []
:save-undo? false}))))))))
(if (empty? typography-changes)
(rx/empty)
(rx/of (dch/commit-changes {:origin it
:redo-changes typography-changes
:undo-changes []
:save-undo? false}))))))))

6
frontend/src/app/main/data/workspace/grid.cljs
View file

@ -76,6 +76,6 @@
(watch [it state _]
(let [page (wsh/lookup-page state)]
(rx/of (dch/commit-changes
(-> (pcb/empty-changes it)
(pcb/with-page page)
(pcb/set-page-option [:saved-grids type] params))))))))
(-> (pcb/empty-changes it)
(pcb/with-page page)
(pcb/set-page-option [:saved-grids type] params))))))))

3
frontend/src/app/main/data/workspace/grid_layout/shortcuts.cljs
View file

@ -64,8 +64,7 @@
:zoom-selected {:tooltip (ds/shift "2")
:command "shift+2"
:fn #(st/emit! dw/zoom-to-selected-shape)}
})
:fn #(st/emit! dw/zoom-to-selected-shape)}})
(defn get-tooltip [shortcut]
(assert (contains? shortcuts shortcut) (str shortcut))

10
frontend/src/app/main/data/workspace/groups.cljs
View file

@ -55,7 +55,7 @@
(empty? (remove removed-id? (:shapes group))))
;; Adds group to the remove and check its parent
(let [to-check (concat to-check [(cfh/get-parent-id objects current-id)]) ]
(let [to-check (concat to-check [(cfh/get-parent-id objects current-id)])]
(recur (first to-check)
(rest to-check)
(conj removed-id? current-id)
@ -243,10 +243,10 @@
(when-not (empty? selected)
(rx/of (dwu/start-undo-transaction undo-id)
(dch/commit-changes changes)
(ptk/data-event :layout/update parents)
(dwu/commit-undo-transaction undo-id)
(dws/select-shapes child-ids)))))))
(dch/commit-changes changes)
(ptk/data-event :layout/update parents)
(dwu/commit-undo-transaction undo-id)
(dws/select-shapes child-ids)))))))
(def mask-group
(ptk/reify ::mask-group

148
frontend/src/app/main/data/workspace/interactions.cljs
View file

@ -41,9 +41,9 @@
:starting-frame starting-frame}]
(rx/of (dch/commit-changes
(-> (pcb/empty-changes it)
(pcb/with-page page)
(pcb/update-page-option :flows ctp/add-flow new-flow))))))))
(-> (pcb/empty-changes it)
(pcb/with-page page)
(pcb/update-page-option :flows ctp/add-flow new-flow))))))))
(defn add-flow-selected-frame
[]
@ -61,9 +61,9 @@
(watch [it state _]
(let [page (wsh/lookup-page state)]
(rx/of (dch/commit-changes
(-> (pcb/empty-changes it)
(pcb/with-page page)
(pcb/update-page-option :flows ctp/remove-flow flow-id))))))))
(-> (pcb/empty-changes it)
(pcb/with-page page)
(pcb/update-page-option :flows ctp/remove-flow flow-id))))))))
(defn rename-flow
[flow-id name]
@ -72,12 +72,12 @@
(ptk/reify ::rename-flow
ptk/WatchEvent
(watch [it state _]
(let [page (wsh/lookup-page state) ]
(let [page (wsh/lookup-page state)]
(rx/of (dch/commit-changes
(-> (pcb/empty-changes it)
(pcb/with-page page)
(pcb/update-page-option :flows ctp/update-flow flow-id
#(ctp/rename-flow % name)))))))))
(-> (pcb/empty-changes it)
(pcb/with-page page)
(pcb/update-page-option :flows ctp/update-flow flow-id
#(ctp/rename-flow % name)))))))))
(defn start-rename-flow
[id]
@ -120,16 +120,16 @@
:flows] [])
flow (ctp/get-frame-flow flows (:id frame))]
(rx/concat
(rx/of (dch/update-shapes [(:id shape)]
(fn [shape]
(let [new-interaction (-> ctsi/default-interaction
(ctsi/set-destination destination)
(assoc :position-relative-to (:id shape)))]
(update shape :interactions
ctsi/add-interaction new-interaction)))))
(when (and (not (connected-frame? objects (:id frame)))
(nil? flow))
(rx/of (add-flow (:id frame))))))))))
(rx/of (dch/update-shapes [(:id shape)]
(fn [shape]
(let [new-interaction (-> ctsi/default-interaction
(ctsi/set-destination destination)
(assoc :position-relative-to (:id shape)))]
(update shape :interactions
ctsi/add-interaction new-interaction)))))
(when (and (not (connected-frame? objects (:id frame)))
(nil? flow))
(rx/of (add-flow (:id frame))))))))))
(defn remove-interaction
[shape index]
@ -137,9 +137,9 @@
ptk/WatchEvent
(watch [_ _ _]
(rx/of (dch/update-shapes [(:id shape)]
(fn [shape]
(update shape :interactions
ctsi/remove-interaction index)))))))
(fn [shape]
(update shape :interactions
ctsi/remove-interaction index)))))))
(defn update-interaction
[shape index update-fn]
@ -147,9 +147,9 @@
ptk/WatchEvent
(watch [_ _ _]
(rx/of (dch/update-shapes [(:id shape)]
(fn [shape]
(update shape :interactions
ctsi/update-interaction index update-fn)))))))
(fn [shape]
(update shape :interactions
ctsi/update-interaction index update-fn)))))))
(defn remove-all-interactions-nav-to
"Remove all interactions that navigate to the given frame."
@ -189,14 +189,14 @@
(let [initial-pos @ms/mouse-position
selected (wsh/lookup-selected state)
stopper (->> stream
(rx/filter mse/mouse-event?)
(rx/filter mse/mouse-up-event?))]
(rx/filter mse/mouse-event?)
(rx/filter mse/mouse-up-event?))]
(when (= 1 (count selected))
(rx/concat
(->> ms/mouse-position
(rx/take-until stopper)
(rx/map #(move-edit-interaction initial-pos %)))
(rx/of (finish-edit-interaction index initial-pos))))))))
(->> ms/mouse-position
(rx/take-until stopper)
(rx/map #(move-edit-interaction initial-pos %)))
(rx/of (finish-edit-interaction index initial-pos))))))))
(defn- get-target-frame
[state position]
@ -252,33 +252,33 @@
undo-id (js/Symbol)]
(rx/of
(dwu/start-undo-transaction undo-id)
(dwu/start-undo-transaction undo-id)
(when (:hide-in-viewer target-frame)
(when (:hide-in-viewer target-frame)
; If the target frame is hidden, we need to unhide it so
; users can navigate to it.
(dch/update-shapes [(:id target-frame)]
#(dissoc % :hide-in-viewer)))
(dch/update-shapes [(:id target-frame)]
#(dissoc % :hide-in-viewer)))
(cond
(or (nil? shape)
(cond
(or (nil? shape)
;; Didn't changed the position for the interaction
(= position initial-pos)
(= position initial-pos)
;; New interaction but invalid target
(and (nil? index) (nil? target-frame)))
nil
(and (nil? index) (nil? target-frame)))
nil
;; Dropped interaction in an invalid target. We remove it
(and (some? index) (nil? target-frame))
(remove-interaction shape index)
(and (some? index) (nil? target-frame))
(remove-interaction shape index)
(nil? index)
(add-new-interaction shape (:id target-frame))
(nil? index)
(add-new-interaction shape (:id target-frame))
:else
(update-interaction shape index change-interaction))
:else
(update-interaction shape index change-interaction))
(dwu/commit-undo-transaction undo-id))))))
(dwu/commit-undo-transaction undo-id))))))
;; --- Overlays
@ -299,8 +299,8 @@
(let [initial-pos @ms/mouse-position
selected (wsh/lookup-selected state)
stopper (->> stream
(rx/filter mse/mouse-event?)
(rx/filter mse/mouse-up-event?))]
(rx/filter mse/mouse-event?)
(rx/filter mse/mouse-up-event?))]
(when (= 1 (count selected))
(let [page-id (:current-page-id state)
objects (wsh/lookup-page-objects state page-id)
@ -317,10 +317,10 @@
(gpt/subtract overlay-pos)
(gpt/subtract frame-pos))]
(rx/concat
(->> ms/mouse-position
(rx/take-until stopper)
(rx/map #(move-overlay-pos % frame-pos offset)))
(rx/of (finish-move-overlay-pos index frame-pos offset)))))))))
(->> ms/mouse-position
(rx/take-until stopper)
(rx/map #(move-overlay-pos % frame-pos offset)))
(rx/of (finish-move-overlay-pos index frame-pos offset)))))))))
(defn move-overlay-pos
[pos frame-pos offset]
@ -333,33 +333,33 @@
(assoc-in state [:workspace-local :move-overlay-to] pos)))))
(defn finish-move-overlay-pos
[index frame-pos offset]
(ptk/reify ::finish-move-overlay-pos
[index frame-pos offset]
(ptk/reify ::finish-move-overlay-pos
ptk/UpdateEvent
(update [_ state]
(-> state
(d/dissoc-in [:workspace-local :move-overlay-to])
(d/dissoc-in [:workspace-local :move-overlay-index])))
ptk/WatchEvent
(watch [_ state _]
(let [pos @ms/mouse-position
overlay-pos (-> pos
(gpt/subtract frame-pos)
(gpt/subtract offset))
ptk/WatchEvent
(watch [_ state _]
(let [pos @ms/mouse-position
overlay-pos (-> pos
(gpt/subtract frame-pos)
(gpt/subtract offset))
page-id (:current-page-id state)
objects (wsh/lookup-page-objects state page-id)
shape (->> state
wsh/lookup-selected
first
(get objects))
page-id (:current-page-id state)
objects (wsh/lookup-page-objects state page-id)
shape (->> state
wsh/lookup-selected
first
(get objects))
interactions (:interactions shape)
interactions (:interactions shape)
new-interactions
(update interactions index
#(ctsi/set-overlay-position % overlay-pos))]
new-interactions
(update interactions index
#(ctsi/set-overlay-position % overlay-pos))]
(rx/of (dch/update-shapes [(:id shape)] #(merge % {:interactions new-interactions})))))))
(rx/of (dch/update-shapes [(:id shape)] #(merge % {:interactions new-interactions})))))))

40
frontend/src/app/main/data/workspace/libraries.cljs
View file

@ -580,11 +580,11 @@
(ptk/reify ::detach-components
ptk/WatchEvent
(watch [_ _ _]
(let [undo-id (js/Symbol)]
(rx/concat
(rx/of (dwu/start-undo-transaction undo-id))
(rx/map #(detach-component %) (rx/from ids))
(rx/of (dwu/commit-undo-transaction undo-id)))))))
(let [undo-id (js/Symbol)]
(rx/concat
(rx/of (dwu/start-undo-transaction undo-id))
(rx/map #(detach-component %) (rx/from ids))
(rx/of (dwu/commit-undo-transaction undo-id)))))))
(def detach-selected-components
(ptk/reify ::detach-selected-components
@ -797,12 +797,12 @@
(watch [_ state _]
(let [current-file-id (:current-file-id state)
undo-id (js/Symbol)]
(rx/of
(dwu/start-undo-transaction undo-id)
(sync-file current-file-id file-id :components component-id undo-group)
(when (not= current-file-id file-id)
(sync-file file-id file-id :components component-id undo-group))
(dwu/commit-undo-transaction undo-id)))))))
(rx/of
(dwu/start-undo-transaction undo-id)
(sync-file current-file-id file-id :components component-id undo-group)
(when (not= current-file-id file-id)
(sync-file file-id file-id :components component-id undo-group))
(dwu/commit-undo-transaction undo-id)))))))
(defn update-component-thumbnail
"Update the thumbnail of the component with the given id, in the
@ -813,10 +813,10 @@
(watch [_ state _]
(rx/of (update-component-thumbnail-sync state component-id file-id "component"))
#_(let [data (get state :workspace-data)
component (ctkl/get-component data component-id)
page-id (:main-instance-page component)
root-id (:main-instance-id component)]
(rx/of (dwt/request-thumbnail file-id page-id root-id "component"))))))
component (ctkl/get-component data component-id)
page-id (:main-instance-page component)
root-id (:main-instance-id component)]
(rx/of (dwt/request-thumbnail file-id page-id root-id "component"))))))
(defn- find-shape-index
[objects id shape-id]
@ -965,15 +965,15 @@
find-frames (fn [change]
(->> (ch/frames-changed file change)
(map #(assoc %1 :page-id (:page-id change)))))
(->> (ch/frames-changed file change)
(map #(assoc %1 :page-id (:page-id change)))))
updated-frames (->> changes
:redo-changes
(mapcat find-frames)
distinct)]
:redo-changes
(mapcat find-frames)
distinct)]
(log/debug :msg "SYNC-FILE finished" :js/rchanges (log-changes
(:redo-changes changes)

10
frontend/src/app/main/data/workspace/libraries_helpers.cljs
View file

@ -976,11 +976,11 @@
[_ new-shapes _]
(ctst/clone-shape component-shape
(:id parent-shape)
(get component-page :objects)
:update-new-shape update-new-shape
:update-original-shape update-original-shape
:dest-objects (get container :objects))
(:id parent-shape)
(get component-page :objects)
:update-new-shape update-new-shape
:update-original-shape update-original-shape
:dest-objects (get container :objects))
add-obj-change (fn [changes shape']
(update changes :redo-changes conj

38
frontend/src/app/main/data/workspace/media.cljs
View file

@ -97,7 +97,7 @@
(rx/map #(svg/add-svg-shapes (assoc svg-data :image-data %) position))))))
(defn- process-uris
[{:keys [file-id local? name uris mtype on-image on-svg] }]
[{:keys [file-id local? name uris mtype on-image on-svg]}]
(letfn [(svg-url? [url]
(or (and mtype (= mtype "image/svg+xml"))
(str/ends-with? url ".svg")))
@ -211,28 +211,28 @@
(defn- process-media-objects
[{:keys [uris on-error] :as params}]
(dm/assert!
(and (sm/check! schema:process-media-objects params)
(or (contains? params :blobs)
(contains? params :uris))))
(and (sm/check! schema:process-media-objects params)
(or (contains? params :blobs)
(contains? params :uris))))
(ptk/reify ::process-media-objects
ptk/WatchEvent
(watch [_ _ _]
(rx/concat
(rx/of (msg/show {:content (tr "media.loading")
:type :info
:timeout nil
:tag :media-loading}))
(->> (if (seq uris)
(rx/of (msg/show {:content (tr "media.loading")
:type :info
:timeout nil
:tag :media-loading}))
(->> (if (seq uris)
;; Media objects is a list of URL's pointing to the path
(process-uris params)
(process-uris params)
;; Media objects are blob of data to be upload
(process-blobs params))
(process-blobs params))
;; Every stream has its own sideeffect. We need to ignore the result
(rx/ignore)
(rx/catch #(handle-media-error % on-error))
(rx/finalize #(st/emit! (msg/hide-tag :media-loading))))))))
(rx/ignore)
(rx/catch #(handle-media-error % on-error))
(rx/finalize #(st/emit! (msg/hide-tag :media-loading))))))))
;; Deprecated in components-v2
(defn upload-media-asset
@ -256,8 +256,8 @@
(defn upload-fill-image
[file on-success]
(dm/assert!
"expected a valid blob for `file` param"
(dmm/blob? file))
"expected a valid blob for `file` param"
(dmm/blob? file))
(ptk/reify ::upload-fill-image
ptk/WatchEvent
(watch [_ state _]
@ -293,9 +293,9 @@
(rx/map #(vector (:name media-obj) %))
(rx/merge-map svg->clj)
(rx/catch ; When error downloading media-obj, skip it and continue with next one
#(log/error :msg (str "Error downloading " (:name media-obj) " from " path)
:hint (ex-message %)
:error %)))))
#(log/error :msg (str "Error downloading " (:name media-obj) " from " path)
:hint (ex-message %)
:error %)))))
(defn create-shapes-svg
"Convert svg elements into penpot shapes."

39
frontend/src/app/main/data/workspace/modifiers.cljs
View file

@ -275,11 +275,11 @@
(update-in [target-frame-id :modifiers] ctm/change-property :layout-item-v-sizing :fix)))))
(defn modif->js
[modif-tree objects]
(clj->js (into {}
(map (fn [[k v]]
[(get-in objects [k :name]) v]))
modif-tree)))
[modif-tree objects]
(clj->js (into {}
(map (fn [[k v]]
[(get-in objects [k :name]) v]))
modif-tree)))
(defn apply-text-modifier
[shape {:keys [width height]}]
@ -301,19 +301,19 @@
(d/update-when result id apply-text-modifier text-modifier))))))
#_(defn apply-path-modifiers
[objects path-modifiers]
(letfn [(apply-path-modifier
[shape {:keys [content-modifiers]}]
(let [shape (update shape :content upc/apply-content-modifiers content-modifiers)
[points selrect] (helpers/content->points+selrect shape (:content shape))]
(assoc shape :selrect selrect :points points)))]
(loop [modifiers (seq path-modifiers)
result objects]
(if (empty? modifiers)
result
(let [[id path-modifier] (first modifiers)]
(recur (rest modifiers)
(update objects id apply-path-modifier path-modifier)))))))
[objects path-modifiers]
(letfn [(apply-path-modifier
[shape {:keys [content-modifiers]}]
(let [shape (update shape :content upc/apply-content-modifiers content-modifiers)
[points selrect] (helpers/content->points+selrect shape (:content shape))]
(assoc shape :selrect selrect :points points)))]
(loop [modifiers (seq path-modifiers)
result objects]
(if (empty? modifiers)
result
(let [[id path-modifier] (first modifiers)]
(recur (rest modifiers)
(update objects id apply-path-modifier path-modifier)))))))
(defn- calculate-modifiers
([state modif-tree]
@ -544,8 +544,7 @@
:layout-item-margin-type
:layout-grid-cells
:layout-grid-columns
:layout-grid-rows
]})
:layout-grid-rows]})
;; We've applied the text-modifier so we can dissoc the temporary data
(fn [state]
(update state :workspace-text-modifier #(apply dissoc % ids)))

2
frontend/src/app/main/data/workspace/path/helpers.cljs
View file

@ -131,7 +131,7 @@
(let [;; To match the angle, the angle should be matching (angle between points 180deg)
angle-handlers (angle-points node handler opposite)
match-angle? (and match-angle? (<= (mth/abs (- 180 angle-handlers) ) 0.1))
match-angle? (and match-angle? (<= (mth/abs (- 180 angle-handlers)) 0.1))
;; To match distance the distance should be matching
match-distance? (and match-distance? (mth/almost-zero? (- (gpt/distance node handler)

10
frontend/src/app/main/data/workspace/path/streams.cljs
View file

@ -53,11 +53,11 @@
start (-> @ms/mouse-position to-pixel-snap)
stoper (rx/merge
(->> st/stream
(rx/filter mse/mouse-event?)
(rx/filter mse/mouse-up-event?))
(->> st/stream
(rx/filter finish-edition?)))
(->> st/stream
(rx/filter mse/mouse-event?)
(rx/filter mse/mouse-up-event?))
(->> st/stream
(rx/filter finish-edition?)))
position-stream
(->> ms/mouse-position

3
frontend/src/app/main/data/workspace/persistence.cljs
View file

@ -145,8 +145,7 @@
:revn file-revn
:session-id sid
:changes-with-metadata (into [] changes)
:features features
}]
:features features}]
(->> (rp/cmd! :update-file params)
(rx/mapcat (fn [lagged]

104
frontend/src/app/main/data/workspace/selection.cljs
View file

@ -368,7 +368,7 @@
(-> (pcb/empty-changes it)
(pcb/with-page page)
(pcb/with-objects all-objects))]
(prepare-duplicate-changes all-objects page ids delta it libraries library-data file-id init-changes)))
(prepare-duplicate-changes all-objects page ids delta it libraries library-data file-id init-changes)))
([all-objects page ids delta it libraries library-data file-id init-changes]
(let [shapes (map (d/getf all-objects) ids)
@ -495,7 +495,7 @@
(not duplicating-component?)
(ctk/detach-shape))
; We want the first added object to touch it's parent, but not subsequent children
;; We want the first added object to touch it's parent, but not subsequent children
changes (-> (pcb/add-object changes new-obj {:ignore-touched (and duplicating-component? child?)})
(pcb/amend-last-change #(assoc % :old-id (:id obj)))
(cond-> (ctl/grid-layout? objects (:parent-id obj))
@ -506,7 +506,7 @@
(and is-component-root? is-component-main?)
(regenerate-component new-obj))
; This is needed for the recursive call to find the new object as parent
;; This is needed for the recursive call to find the new object as parent
page' (ctst/add-shape (:id new-obj)
new-obj
{:objects objects}
@ -545,15 +545,15 @@
(if-not (empty? frames-with-flow)
(let [update-flows (fn [flows]
(reduce
(fn [flows frame]
(let [name (cfh/generate-unique-name @unames "Flow 1")
_ (vswap! unames conj name)
new-flow {:id (uuid/next)
:name name
:starting-frame (get ids-map (:id frame))}]
(ctp/add-flow flows new-flow)))
flows
frames-with-flow))]
(fn [flows frame]
(let [name (cfh/generate-unique-name @unames "Flow 1")
_ (vswap! unames conj name)
new-flow {:id (uuid/next)
:name name
:starting-frame (get ids-map (:id frame))}]
(ctp/add-flow flows new-flow)))
flows
frames-with-flow))]
(pcb/update-page-option changes :flows update-flows))
changes)))
@ -611,9 +611,9 @@
objects-indices (->> index-map (d/mapm fix-indices) (vals) (reduce merge))]
(pcb/amend-changes
changes
(fn [change]
(assoc change :index (get objects-indices (:old-id change)))))))
changes
(fn [change]
(assoc change :index (get objects-indices (:old-id change)))))))
(defn clear-memorize-duplicated
[]
@ -671,52 +671,52 @@
([move-delta?]
(duplicate-selected move-delta? false))
([move-delta? alt-duplication?]
(ptk/reify ::duplicate-selected
ptk/WatchEvent
(watch [it state _]
(when (or (not move-delta?) (nil? (get-in state [:workspace-local :transform])))
(let [page (wsh/lookup-page state)
objects (:objects page)
selected (->> (wsh/lookup-selected state)
(map #(get objects %))
(remove #(ctk/in-component-copy-not-root? %)) ;; We don't want to change the structure of component copies
(map :id)
set)]
(when (seq selected)
(let [obj (get objects (first selected))
delta (if move-delta?
(calc-duplicate-delta obj state objects)
(gpt/point 0 0))
(ptk/reify ::duplicate-selected
ptk/WatchEvent
(watch [it state _]
(when (or (not move-delta?) (nil? (get-in state [:workspace-local :transform])))
(let [page (wsh/lookup-page state)
objects (:objects page)
selected (->> (wsh/lookup-selected state)
(map #(get objects %))
(remove #(ctk/in-component-copy-not-root? %)) ;; We don't want to change the structure of component copies
(map :id)
set)]
(when (seq selected)
(let [obj (get objects (first selected))
delta (if move-delta?
(calc-duplicate-delta obj state objects)
(gpt/point 0 0))
file-id (:current-file-id state)
libraries (wsh/get-libraries state)
library-data (wsh/get-file state file-id)
file-id (:current-file-id state)
libraries (wsh/get-libraries state)
library-data (wsh/get-file state file-id)
changes (->> (prepare-duplicate-changes objects page selected delta it libraries library-data file-id)
(duplicate-changes-update-indices objects selected))
changes (->> (prepare-duplicate-changes objects page selected delta it libraries library-data file-id)
(duplicate-changes-update-indices objects selected))
tags (or (:tags changes) #{})
tags (or (:tags changes) #{})
changes (cond-> changes alt-duplication? (assoc :tags (conj tags :alt-duplication)))
changes (cond-> changes alt-duplication? (assoc :tags (conj tags :alt-duplication)))
id-original (first selected)
id-original (first selected)
new-selected (->> changes
:redo-changes
(filter #(= (:type %) :add-obj))
(filter #(selected (:old-id %)))
(map #(get-in % [:obj :id]))
(into (d/ordered-set)))
new-selected (->> changes
:redo-changes
(filter #(= (:type %) :add-obj))
(filter #(selected (:old-id %)))
(map #(get-in % [:obj :id]))
(into (d/ordered-set)))
id-duplicated (first new-selected)
id-duplicated (first new-selected)
frames (into #{}
(map #(get-in objects [% :frame-id]))
selected)
undo-id (js/Symbol)]
frames (into #{}
(map #(get-in objects [% :frame-id]))
selected)
undo-id (js/Symbol)]
;; Warning: This order is important for the focus mode.
(rx/of
;; Warning: This order is important for the focus mode.
(rx/of
(dwu/start-undo-transaction undo-id)
(dch/commit-changes changes)
(select-shapes new-selected)

12
frontend/src/app/main/data/workspace/shortcuts.cljs
View file

@ -255,7 +255,7 @@
:command "t"
:subsections [:tools]
:fn #(emit-when-no-readonly dwtxt/start-edit-if-selected
(dwd/select-for-drawing :text))}
(dwd/select-for-drawing :text))}
:draw-path {:tooltip "P"
:command "p"
@ -399,7 +399,7 @@
:command (ds/c-mod "shift+e")
:subsections [:basics :main-menu]
:fn #(st/emit!
(de/show-workspace-export-dialog))}
(de/show-workspace-export-dialog))}
:toggle-snap-guide {:tooltip (ds/meta-shift "G")
:command (ds/c-mod "shift+g")
@ -432,15 +432,15 @@
:command (ds/a-mod "p")
:subsections [:panels]
:fn #(do (r/set-resize-type! :bottom)
(emit-when-no-readonly (dw/remove-layout-flag :textpalette)
(toggle-layout-flag :colorpalette)))}
(emit-when-no-readonly (dw/remove-layout-flag :textpalette)
(toggle-layout-flag :colorpalette)))}
:toggle-textpalette {:tooltip (ds/alt "T")
:command (ds/a-mod "t")
:subsections [:panels]
:fn #(do (r/set-resize-type! :bottom)
(emit-when-no-readonly (dw/remove-layout-flag :colorpalette)
(toggle-layout-flag :textpalette)))}
(emit-when-no-readonly (dw/remove-layout-flag :colorpalette)
(toggle-layout-flag :textpalette)))}
:hide-ui {:tooltip "\\"
:command "\\"

30
frontend/src/app/main/data/workspace/specialized_panel.cljs
View file

@ -24,18 +24,18 @@
(defn open-specialized-panel
[type]
(ptk/reify ::open-specialized-panel
ptk/UpdateEvent
(update [_ state]
(let [page-id (:current-page-id state)
objects (wsh/lookup-page-objects state page-id)
selected-ids (wsh/lookup-selected state)
selected-shapes (map (d/getf objects) selected-ids)]
(assoc state :specialized-panel {:type type :shapes selected-shapes})))
ptk/WatchEvent
(watch [_ _ stream]
(->> (rx/merge
(rx/filter interrupt? stream)
(rx/filter (ptk/type? ::dwc/undo) stream))
(rx/take 1)
(rx/map clear-specialized-panel)))))
(ptk/reify ::open-specialized-panel
ptk/UpdateEvent
(update [_ state]
(let [page-id (:current-page-id state)
objects (wsh/lookup-page-objects state page-id)
selected-ids (wsh/lookup-selected state)
selected-shapes (map (d/getf objects) selected-ids)]
(assoc state :specialized-panel {:type type :shapes selected-shapes})))
ptk/WatchEvent
(watch [_ _ stream]
(->> (rx/merge
(rx/filter interrupt? stream)
(rx/filter (ptk/type? ::dwc/undo) stream))
(rx/take 1)
(rx/map clear-specialized-panel)))))

20
frontend/src/app/main/data/workspace/text/shortcuts.cljs
View file

@ -76,11 +76,11 @@
(or (= variant-id "remove-bold")
(= variant-id "toggle-bold")))
add-italic? (and (not italic?)
(or (= variant-id "add-italic")
(= variant-id "toggle-italic")))
(or (= variant-id "add-italic")
(= variant-id "toggle-italic")))
remove-italic? (and italic?
(or (= variant-id "remove-italic")
(= variant-id "toggle-italic")))]
(or (= variant-id "remove-italic")
(= variant-id "toggle-italic")))]
(cond
(and add-bold? italic?) ;; it is italic, set it to bold+italic
(choose-bold-italic)
@ -127,8 +127,7 @@
:attrs dwt/text-attrs}))))
(defn- update-attrs [shape props]
(let [
text-values (calculate-text-values shape)
(let [text-values (calculate-text-values shape)
font-size (d/parse-double (:font-size text-values))
line-height (d/parse-double (:line-height text-values))
letter-spacing (d/parse-double (:letter-spacing text-values))
@ -166,8 +165,7 @@
all-underline? (every? #(= (:text-decoration %) "underline") text-values)
all-line-through? (every? #(= (:text-decoration %) "line-through") text-values)
all-bold? (every? #(is-bold? (:font-variant-id %)) text-values)
all-italic? (every? #(is-italic? (:font-variant-id %)) text-values)
]
all-italic? (every? #(is-italic? (:font-variant-id %)) text-values)]
(cond
(= (:text-decoration props) "toggle-underline")
(if all-underline?
@ -197,9 +195,9 @@
(blend-props text-shapes props)
props)]
(when (and (not read-only?) text-shapes)
(st/emit! (dwu/start-undo-transaction undo-id))
(run! #(update-attrs % props) text-shapes)
(st/emit! (dwu/commit-undo-transaction undo-id)))))
(st/emit! (dwu/start-undo-transaction undo-id))
(run! #(update-attrs % props) text-shapes)
(st/emit! (dwu/commit-undo-transaction undo-id)))))
(def shortcuts
{:text-align-left {:tooltip (ds/meta (ds/alt "L"))

3
frontend/src/app/main/data/workspace/texts.cljs
View file

@ -339,8 +339,7 @@
(and (d/not-empty? color-attrs) (nil? (:fills node)))
(-> (dissoc :fill-color :fill-opacity :fill-color-ref-id :fill-color-ref-file :fill-color-gradient)
(assoc :fills [color-attrs])))
))
(assoc :fills [color-attrs])))))
(defn migrate-content
[content]

10
frontend/src/app/main/data/workspace/transforms.cljs
View file

@ -45,13 +45,13 @@
;; for example, right will only grow in the x coordinate and left
;; will grow in the inverse of the x coordinate
(def ^:private handler-multipliers
{:right [ 1 0]
:bottom [ 0 1]
{:right [1 0]
:bottom [0 1]
:left [-1 0]
:top [ 0 -1]
:top-right [ 1 -1]
:top [0 -1]
:top-right [1 -1]
:top-left [-1 -1]
:bottom-right [ 1 1]
:bottom-right [1 1]
:bottom-left [-1 1]})
(defn- handler-resize-origin

28
frontend/src/app/main/data/workspace/undo.cljs
View file

@ -64,13 +64,13 @@
items (conj-undo-entry items entry)]
(-> state
(update :workspace-undo assoc :items items
:index (min (inc index)
(dec MAX-UNDO-SIZE)))))
:index (min (inc index)
(dec MAX-UNDO-SIZE)))))
state))
(defn- stack-undo-entry
[state {:keys [undo-changes redo-changes] :as entry}]
(let [index (get-in state [:workspace-undo :index] -1)]
(let [index (get-in state [:workspace-undo :index] -1)]
(if (>= index 0)
(update-in state [:workspace-undo :items index]
(fn [item]
@ -86,7 +86,7 @@
(update-in [:workspace-undo :transaction :redo-changes] #(into % redo-changes))
(cond->
(nil? (get-in state [:workspace-undo :transaction :undo-group]))
(assoc-in [:workspace-undo :transaction :undo-group] undo-group))
(assoc-in [:workspace-undo :transaction :undo-group] undo-group))
(assoc-in [:workspace-undo :transaction :tags] tags)))
(defn append-undo
@ -101,18 +101,18 @@
(ptk/reify ::append-undo
ptk/UpdateEvent
(update [_ state]
(cond
(and (get-in state [:workspace-undo :transaction])
(or (not stack?)
(d/not-empty? (get-in state [:workspace-undo :transaction :undo-changes]))
(d/not-empty? (get-in state [:workspace-undo :transaction :redo-changes]))))
(accumulate-undo-entry state entry)
(cond
(and (get-in state [:workspace-undo :transaction])
(or (not stack?)
(d/not-empty? (get-in state [:workspace-undo :transaction :undo-changes]))
(d/not-empty? (get-in state [:workspace-undo :transaction :redo-changes]))))
(accumulate-undo-entry state entry)
stack?
(stack-undo-entry state entry)
stack?
(stack-undo-entry state entry)
:else
(add-undo-entry state entry)))))
:else
(add-undo-entry state entry)))))
(def empty-tx
{:undo-changes [] :redo-changes []})

80
frontend/src/app/main/fonts.cljs
View file

@ -196,40 +196,40 @@
(if-not (exists? js/window)
;; If we are in the worker environment, we just mark it as loaded
;; without really loading it.
(do
(swap! loaded-hints conj {:font-id font-id :font-variant-id variant-id})
(p/resolved font-id))
(do
(swap! loaded-hints conj {:font-id font-id :font-variant-id variant-id})
(p/resolved font-id))
(let [font (get @fontsdb font-id)]
(cond
(nil? font)
(p/resolved font-id)
(let [font (get @fontsdb font-id)]
(cond
(nil? font)
(p/resolved font-id)
;; Font already loaded, we just continue
(contains? @loaded font-id)
(p/resolved font-id)
(contains? @loaded font-id)
(p/resolved font-id)
;; Font is currently downloading. We attach the caller to the promise
(contains? @loading font-id)
(p/resolved (get @loading font-id))
(contains? @loading font-id)
(p/resolved (get @loading font-id))
;; First caller, we create the promise and then wait
:else
(let [on-load (fn [resolve]
(swap! loaded conj font-id)
(swap! loading dissoc font-id)
(resolve font-id))
:else
(let [on-load (fn [resolve]
(swap! loaded conj font-id)
(swap! loading dissoc font-id)
(resolve font-id))
load-p (->> (p/create
(fn [resolve _]
(-> font
(assoc ::on-loaded (partial on-load resolve))
(load-font))))
load-p (->> (p/create
(fn [resolve _]
(-> font
(assoc ::on-loaded (partial on-load resolve))
(load-font))))
;; We need to wait for the font to be loaded
(p/delay 120))]
(p/delay 120))]
(swap! loading assoc font-id load-p)
load-p))))))
(swap! loading assoc font-id load-p)
load-p))))))
(defn ready
[cb]
@ -253,22 +253,22 @@
[node]
(let [nodes (.from js/Array (dom/query-all node "[style*=font]"))
result (.reduce nodes (fn [obj node]
(let [style (.-style node)
font-family (.-fontFamily style)
[_ font] (first
(filter (fn [[_ {:keys [id family]}]]
(or (= family font-family)
(= id font-family)))
@fontsdb))
font-id (:id font)
font-variant (get-variant font (.-fontVariant style))
font-variant-id (:id font-variant)]
(obj/set!
obj
(dm/str font-id ":" font-variant-id)
{:font-id font-id
:font-variant-id font-variant-id})))
#js {})]
(let [style (.-style node)
font-family (.-fontFamily style)
[_ font] (first
(filter (fn [[_ {:keys [id family]}]]
(or (= family font-family)
(= id font-family)))
@fontsdb))
font-id (:id font)
font-variant (get-variant font (.-fontVariant style))
font-variant-id (:id font-variant)]
(obj/set!
obj
(dm/str font-id ":" font-variant-id)
{:font-id font-id
:font-variant-id font-variant-id})))
#js {})]
(.values js/Object result)))
(defn get-content-fonts

82
frontend/src/app/main/render.cljs
View file

@ -339,53 +339,53 @@
{::mf/wrap [mf/memo #(mf/deferred % ts/idle-then-raf)]}
[{:keys [objects root-shape show-grids? zoom] :or {zoom 1} :as props}]
(when root-shape
(let [root-shape-id (:id root-shape)
include-metadata (mf/use-ctx export/include-metadata-ctx)
(let [root-shape-id (:id root-shape)
include-metadata (mf/use-ctx export/include-metadata-ctx)
vector
(mf/use-memo
(mf/deps (:x root-shape) (:y root-shape))
(fn []
(-> (gpt/point (:x root-shape) (:y root-shape))
(gpt/negate))))
vector
(mf/use-memo
(mf/deps (:x root-shape) (:y root-shape))
(fn []
(-> (gpt/point (:x root-shape) (:y root-shape))
(gpt/negate))))
objects
(mf/use-memo
(mf/deps vector objects root-shape-id)
(fn []
(let [children-ids (cons root-shape-id (cfh/get-children-ids objects root-shape-id))
update-fn #(update %1 %2 gsh/transform-shape (ctm/move-modifiers vector))]
(reduce update-fn objects children-ids))))
objects
(mf/use-memo
(mf/deps vector objects root-shape-id)
(fn []
(let [children-ids (cons root-shape-id (cfh/get-children-ids objects root-shape-id))
update-fn #(update %1 %2 gsh/transform-shape (ctm/move-modifiers vector))]
(reduce update-fn objects children-ids))))
root-shape' (get objects root-shape-id)
width (* (:width root-shape') zoom)
height (* (:height root-shape') zoom)
vbox (format-viewbox {:width (:width root-shape' 0)
:height (:height root-shape' 0)})
root-shape-wrapper
(mf/use-memo
(mf/deps objects root-shape')
(fn []
(case (:type root-shape')
:group (group-wrapper-factory objects)
:frame (frame-wrapper-factory objects))))]
root-shape' (get objects root-shape-id)
width (* (:width root-shape') zoom)
height (* (:height root-shape') zoom)
vbox (format-viewbox {:width (:width root-shape' 0)
:height (:height root-shape' 0)})
root-shape-wrapper
(mf/use-memo
(mf/deps objects root-shape')
(fn []
(case (:type root-shape')
:group (group-wrapper-factory objects)
:frame (frame-wrapper-factory objects))))]
[:svg {:view-box vbox
:width (ust/format-precision width viewbox-decimal-precision)
:height (ust/format-precision height viewbox-decimal-precision)
:version "1.1"
:xmlns "http://www.w3.org/2000/svg"
:xmlnsXlink "http://www.w3.org/1999/xlink"
:xmlns:penpot (when include-metadata "https://penpot.app/xmlns")
:fill "none"}
[:svg {:view-box vbox
:width (ust/format-precision width viewbox-decimal-precision)
:height (ust/format-precision height viewbox-decimal-precision)
:version "1.1"
:xmlns "http://www.w3.org/2000/svg"
:xmlnsXlink "http://www.w3.org/1999/xlink"
:xmlns:penpot (when include-metadata "https://penpot.app/xmlns")
:fill "none"}
[:*
[:> shape-container {:shape root-shape'}
[:& (mf/provider muc/is-component?) {:value true}
[:& root-shape-wrapper {:shape root-shape' :view-box vbox}]]]
[:*
[:> shape-container {:shape root-shape'}
[:& (mf/provider muc/is-component?) {:value true}
[:& root-shape-wrapper {:shape root-shape' :view-box vbox}]]]
(when show-grids?
[:& empty-grids {:root-shape-id root-shape-id :objects objects}])]])))
(when show-grids?
[:& empty-grids {:root-shape-id root-shape-id :objects objects}])]])))
(mf/defc component-svg-thumbnail
{::mf/wrap [mf/memo #(mf/deferred % ts/idle-then-raf)]}

3
frontend/src/app/main/repo.cljs
View file

@ -66,8 +66,7 @@
:form-data? true}
:export-binfile {:response-type :blob}
:retrieve-list-of-builtin-templates {:query-params :all}
})
:retrieve-list-of-builtin-templates {:query-params :all}})
(defn- send!
"A simple helper for a common case of sending and receiving transit

2
frontend/src/app/main/snap.cljs
View file

@ -181,7 +181,7 @@
range-tree
(- cd snap-distance-accuracy)
(+ cd snap-distance-accuracy))
(map #(- (first %) cd ))))))))
(map #(- (first %) cd))))))))
get-middle-snaps
(fn [lt-dist gt-dist]

2
frontend/src/app/main/store.cljs
View file

@ -43,7 +43,7 @@
(when (and *debug-events*
(ptk/event? e)
(not (debug-exclude-events (ptk/type e))))
(.log js/console (str "[stream]: " (ptk/repr-event e)) )))))
(.log js/console (str "[stream]: " (ptk/repr-event e)))))))
(defonce state
(ptk/store {:resolve ptk/resolve

18
frontend/src/app/main/style.clj
View file

@ -33,16 +33,16 @@
(def ^:private xform-css
(keep (fn [k]
(cond
(keyword? k)
(let [knm (name k)
kns (namespace k)]
(case kns
"global" knm
(str *css-prefix* knm)))
(cond
(keyword? k)
(let [knm (name k)
kns (namespace k)]
(case kns
"global" knm
(str *css-prefix* knm)))
(string? k)
k))))
(string? k)
k))))
(defmacro css*
"Just coerces all params to strings and concats them with

46
frontend/src/app/main/ui/auth/login.cljs
View file

@ -40,18 +40,18 @@
(dom/prevent-default event)
(->> (rp/cmd! :login-with-oidc (assoc params :provider provider))
(rx/subs! (fn [{:keys [redirect-uri] :as rsp}]
(if redirect-uri
(.replace js/location redirect-uri)
(log/error :hint "unexpected response from OIDC method"
:resp (pr-str rsp))))
(fn [{:keys [type code] :as error}]
(cond
(and (= type :restriction)
(= code :provider-not-configured))
(st/emit! (dm/error (tr "errors.auth-provider-not-configured")))
(if redirect-uri
(.replace js/location redirect-uri)
(log/error :hint "unexpected response from OIDC method"
:resp (pr-str rsp))))
(fn [{:keys [type code] :as error}]
(cond
(and (= type :restriction)
(= code :provider-not-configured))
(st/emit! (dm/error (tr "errors.auth-provider-not-configured")))
:else
(st/emit! (dm/error (tr "errors.generic"))))))))
:else
(st/emit! (dm/error (tr "errors.generic"))))))))
(defn- login-with-ldap
[event params]
@ -60,20 +60,20 @@
(let [{:keys [on-error]} (meta params)]
(->> (rp/cmd! :login-with-ldap params)
(rx/subs! (fn [profile]
(if-let [token (:invitation-token profile)]
(st/emit! (rt/nav :auth-verify-token {} {:token token}))
(st/emit! (du/login-from-token {:profile profile}))))
(fn [{:keys [type code] :as error}]
(cond
(and (= type :restriction)
(= code :ldap-not-initialized))
(st/emit! (dm/error (tr "errors.ldap-disabled")))
(if-let [token (:invitation-token profile)]
(st/emit! (rt/nav :auth-verify-token {} {:token token}))
(st/emit! (du/login-from-token {:profile profile}))))
(fn [{:keys [type code] :as error}]
(cond
(and (= type :restriction)
(= code :ldap-not-initialized))
(st/emit! (dm/error (tr "errors.ldap-disabled")))
(fn? on-error)
(on-error error)
(fn? on-error)
(on-error error)
:else
(st/emit! (dm/error (tr "errors.generic")))))))))
:else
(st/emit! (dm/error (tr "errors.generic")))))))))
(s/def ::email ::us/email)
(s/def ::password ::us/not-empty-string)

2
frontend/src/app/main/ui/auth/register.cljs
View file

@ -232,7 +232,7 @@
(->> (rp/cmd! :register-profile params)
(rx/finalize #(reset! submitted? false))
(rx/subs! on-success
(partial handle-register-error form))))))]
(partial handle-register-error form))))))]
[:& fm/form {:on-submit on-submit :form form}
[:div {:class (stl/css :fields-row)}

26
frontend/src/app/main/ui/comments.cljs
View file

@ -28,7 +28,7 @@
[rumext.v2 :as mf]))
(mf/defc resizing-textarea
{::mf/wrap-props false }
{::mf/wrap-props false}
[props]
(let [value (d/nilv (unchecked-get props "value") "")
on-focus (unchecked-get props "on-focus")
@ -51,14 +51,14 @@
on-key-down
(mf/use-fn
(mf/deps on-esc on-ctrl-enter on-change*)
(fn [event]
(cond
(and (kbd/esc? event) (fn? on-esc)) (on-esc event)
(and (kbd/mod? event) (kbd/enter? event) (fn? on-ctrl-enter))
(do
(on-change* event)
(on-ctrl-enter event)))))
(mf/deps on-esc on-ctrl-enter on-change*)
(fn [event]
(cond
(and (kbd/esc? event) (fn? on-esc)) (on-esc event)
(and (kbd/mod? event) (kbd/enter? event) (fn? on-ctrl-enter))
(do
(on-change* event)
(on-ctrl-enter event)))))
on-focus*
(mf/use-fn
@ -168,13 +168,13 @@
on-change
(mf/use-fn
(mf/deps draft)
(fn [content]
(st/emit! (dcm/update-draft-thread {:content content}))))
(fn [content]
(st/emit! (dcm/update-draft-thread {:content content}))))
on-submit
(mf/use-fn
(mf/deps draft)
(partial on-submit draft))]
(mf/deps draft)
(partial on-submit draft))]
[:*
[:div

4
frontend/src/app/main/ui/components/buttons/simple_button.cljs
View file

@ -1,10 +1,10 @@
(ns app.main.ui.components.buttons.simple-button
(:require-macros [app.main.style :as stl])
(:require
[rumext.v2 :as mf]))
[rumext.v2 :as mf]))
(mf/defc simple-button
{::mf/wrap-props false}
[{:keys [on-click children]}]
[:button {:on-click on-click :class (stl/css :button)} children])
[:button {:on-click on-click :class (stl/css :button)} children])

4
frontend/src/app/main/ui/components/color_bullet.cljs
View file

@ -37,11 +37,11 @@
(cond
(:gradient color)
[:div.color-bullet-wrapper {:style {:background (uc/color->background color)}}]
(:image color)
(let [uri (cfg/resolve-file-media (:image color))]
[:div.color-bullet-wrapper {:style {:background-size "contain" :background-image (str/ffmt "url(%)" uri)}}])
:else
[:div.color-bullet-wrapper
[:div.color-bullet-left {:style {:background (uc/color->background (assoc color :opacity 1))}}]

18
frontend/src/app/main/ui/components/color_input.cljs
View file

@ -114,20 +114,20 @@
on-mouse-up
(mf/use-fn
(fn [event]
(dom/prevent-default event)))
(fn [event]
(dom/prevent-default event)))
handle-focus
(mf/use-fn
(fn [event]
(let [target (dom/get-target event)]
(when on-focus
(on-focus event))
(fn [event]
(let [target (dom/get-target event)]
(when on-focus
(on-focus event))
(when select-on-focus?
(-> event (dom/get-target) (.select))
(when select-on-focus?
(-> event (dom/get-target) (.select))
;; In webkit browsers the mouseup event will be called after the on-focus causing and unselect
(.addEventListener target "mouseup" on-mouse-up #js {"once" true})))))
(.addEventListener target "mouseup" on-mouse-up #js {"once" true})))))
props (-> (obj/clone props)
(obj/unset! "selectOnFocus")

24
frontend/src/app/main/ui/components/forms.cljs
View file

@ -361,17 +361,17 @@
(zero? (count @items)))
klass (str (get props :class) " "
(stl/css-case
:focus @focus?
:valid (and touched? (not error))
:invalid (and touched? error)
:empty empty?
:custom-multi-input true))
(stl/css-case
:focus @focus?
:valid (and touched? (not error))
:invalid (and touched? error)
:empty empty?
:custom-multi-input true))
in-klass (str class " "
(stl/css-case
:inside-input true
:no-padding (pos? (count @items))))
(stl/css-case
:inside-input true
:no-padding (pos? (count @items))))
on-focus
(mf/use-fn #(reset! focus? true))
@ -481,7 +481,7 @@
(> (count value) length))
(defn validate-length
[field length errors-msg ]
[field length errors-msg]
(fn [errors data]
(cond-> errors
(max-length? (get data field) length)
@ -500,6 +500,6 @@
(let [value (get data field)]
(cond-> errors
(and
(all-spaces? value)
(> (count value) 0))
(all-spaces? value)
(> (count value) 0))
(assoc field {:message error-msg})))))

2
frontend/src/app/main/ui/components/link.cljs
View file

@ -18,4 +18,4 @@
(keyboard-action event)))
:tab-index "0"
:data-test data-test}
[:* children]]))
[:* children]]))

2
frontend/src/app/main/ui/components/search_bar.cljs
View file

@ -46,7 +46,7 @@
(when ^boolean enter? (dom/blur! node))
(when ^boolean esc? (dom/blur! node)))))]
[:span {:class (stl/css-case :search-box true
:has-children (some? children))}
:has-children (some? children))}
children
[:div {:class (stl/css :search-input-wrapper)}
icon

6
frontend/src/app/main/ui/components/tab_container.cljs
View file

@ -50,7 +50,7 @@
(when (fn? on-change) (on-change id)))))]
[:div {:class (stl/css :tab-container)}
[:div {:class (dm/str class " "(stl/css :tab-container-tabs))}
[:div {:class (dm/str class " " (stl/css :tab-container-tabs))}
(when collapsable?
[:button
{:on-click handle-collapse
@ -67,7 +67,7 @@
:data-id (d/name id)
:on-click select-fn
:class (stl/css-case :tab-container-tab-title true
:current (= selected id))}
:current (= selected id))}
title]))]]
[:div {:class (dm/str content-class " " (stl/css :tab-container-content ))}
[:div {:class (dm/str content-class " " (stl/css :tab-container-content))}
(d/seek #(= selected (-> % .-props .-id)) children)]]))

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

@ -43,7 +43,7 @@
team-id (get-in route [:params :path :team-id])
project-id (get-in route [:params :path :project-id])]
(cond->
{:search-term search-term}
{:search-term search-term}
(uuid-str? team-id)
(assoc :team-id (uuid team-id))

6
frontend/src/app/main/ui/dashboard/comments.cljs
View file

@ -75,9 +75,9 @@
(with-meta {::ev/origin "dashboard"})))))]
(mf/use-effect
(mf/deps team-id)
(fn []
(st/emit! (dcm/retrieve-unread-comment-threads team-id))))
(mf/deps team-id)
(fn []
(st/emit! (dcm/retrieve-unread-comment-threads team-id))))
(mf/use-effect
(mf/deps show?)

2
frontend/src/app/main/ui/dashboard/file_menu.cljs
View file

@ -196,7 +196,7 @@
(->> (rp/cmd! :get-all-projects)
(rx/map group-by-team)
(rx/subs! #(when (mf/ref-val mounted-ref)
(reset! teams %)))))))
(reset! teams %)))))))
(when current-team
(let [sub-options (concat (vec (for [project current-projects]

16
frontend/src/app/main/ui/dashboard/fonts.cljs
View file

@ -67,9 +67,9 @@
(fn [blobs]
(->> (df/process-upload blobs (:id team))
(rx/subs! (fn [result]
(swap! fonts df/merge-and-group-fonts installed-fonts result))
(fn [error]
(js/console.error "error" error))))))
(swap! fonts df/merge-and-group-fonts installed-fonts result))
(fn [error]
(js/console.error "error" error))))))
on-upload
(mf/use-callback
@ -79,11 +79,11 @@
(->> (rp/cmd! :create-font-variant item)
(rx/delay-at-least 2000)
(rx/subs! (fn [font]
(swap! fonts dissoc (:id item))
(swap! uploading disj (:id item))
(st/emit! (df/add-font font)))
(fn [error]
(js/console.log "error" error))))))
(swap! fonts dissoc (:id item))
(swap! uploading disj (:id item))
(st/emit! (df/add-font font)))
(fn [error]
(js/console.log "error" error))))))
on-upload-all
(fn [items]

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

@ -74,12 +74,12 @@
(when (and visible? (not thumbnail-uri))
(->> (ask-for-thumbnail file-id revn)
(rx/subs! (fn [url]
(st/emit! (dd/set-file-thumbnail file-id url)))
(fn [cause]
(log/error :hint "unable to render thumbnail"
:file-if file-id
:revn revn
:message (ex-message cause)))))))
(st/emit! (dd/set-file-thumbnail file-id url)))
(fn [cause]
(log/error :hint "unable to render thumbnail"
:file-if file-id
:revn revn
:message (ex-message cause)))))))
[:div {:class (stl/css :grid-item-th)
:style {:background-color background-color}
@ -514,12 +514,12 @@
(do
(dom/prevent-default e)
(when-not (or (dnd/from-child? e)
(dnd/broken-event? e))
(dnd/broken-event? e))
(when (not= selected-project project-id)
(reset! dragging? true))))
(or (dnd/has-type? e "Files")
(dnd/has-type? e "application/x-moz-file"))
(dnd/has-type? e "application/x-moz-file"))
(do
(dom/prevent-default e)
(reset! dragging? true)))))
@ -559,7 +559,7 @@
(st/emit! (dd/move-files (with-meta data mdata))))))
(or (dnd/has-type? e "Files")
(dnd/has-type? e "application/x-moz-file"))
(dnd/has-type? e "application/x-moz-file"))
(do
(dom/prevent-default e)
(reset! dragging? false)

66
frontend/src/app/main/ui/dashboard/project_menu.cljs
View file

@ -82,40 +82,40 @@
(when (fn? on-import) (on-import))))
options [(when-not (:is-default project)
{:option-name (tr "labels.rename")
:id "project-menu-rename"
:option-handler on-edit
:data-test "project-rename"})
(when-not (:is-default project)
{:option-name (tr "dashboard.duplicate")
:id "project-menu-duplicated"
:option-handler on-duplicate
:data-test "project-duplicate"})
(when-not (:is-default project)
{:option-name (tr "dashboard.pin-unpin")
:id "project-menu-pin"
:option-handler toggle-pin})
{:option-name (tr "labels.rename")
:id "project-menu-rename"
:option-handler on-edit
:data-test "project-rename"})
(when-not (:is-default project)
{:option-name (tr "dashboard.duplicate")
:id "project-menu-duplicated"
:option-handler on-duplicate
:data-test "project-duplicate"})
(when-not (:is-default project)
{:option-name (tr "dashboard.pin-unpin")
:id "project-menu-pin"
:option-handler toggle-pin})
(when (and (seq teams) (not (:is-default project)))
{:option-name (tr "dashboard.move-to")
:id "project-menu-move-to"
:sub-options (for [team teams]
{:option-name (:name team)
:id (:name team)
:option-handler (on-move (:id team))})
:data-test "project-move-to"})
(when (some? on-import)
{:option-name (tr "dashboard.import")
:id "project-menu-import"
:option-handler on-import-files
:data-test "file-import"})
(when-not (:is-default project)
{:option-name :separator})
(when-not (:is-default project)
{:option-name (tr "labels.delete")
:id "project-menu-delete"
:option-handler on-delete
:data-test "project-delete"})]]
(when (and (seq teams) (not (:is-default project)))
{:option-name (tr "dashboard.move-to")
:id "project-menu-move-to"
:sub-options (for [team teams]
{:option-name (:name team)
:id (:name team)
:option-handler (on-move (:id team))})
:data-test "project-move-to"})
(when (some? on-import)
{:option-name (tr "dashboard.import")
:id "project-menu-import"
:option-handler on-import-files
:data-test "file-import"})
(when-not (:is-default project)
{:option-name :separator})
(when-not (:is-default project)
{:option-name (tr "labels.delete")
:id "project-menu-delete"
:option-handler on-delete
:data-test "project-delete"})]]
[:*
[:& udi/import-form {:ref file-input

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

@ -370,8 +370,8 @@
you-admin? (get-in team [:permissions :is-admin])
can-invite? (or you-owner? you-admin?)
team-hero? (and can-invite?
(:team-hero? props true)
(not (:is-default team)))
(:team-hero? props true)
(not (:is-default team)))
tutorial-viewed? (:viewed-tutorial? props true)
walkthrough-viewed? (:viewed-walkthrough? props true)

2
frontend/src/app/main/ui/dashboard/team.cljs
View file

@ -949,7 +949,7 @@
(mf/with-effect [team]
(st/emit! (dd/fetch-team-webhooks)))
[:*
[:*
[:& header {:team team :section :dashboard-team-webhooks}]
[:section {:class (stl/css :dashboard-container :dashboard-team-webhooks)}
[:*

2
frontend/src/app/main/ui/delete_shared.cljs
View file

@ -5,7 +5,7 @@
;; Copyright (c) KALEIDOS INC
(ns app.main.ui.delete-shared
(:require-macros [app.main.style :as stl])
(:require-macros [app.main.style :as stl])
(:require
[app.common.data.macros :as dm]
[app.main.data.modal :as modal]

6
frontend/src/app/main/ui/export.cljs
View file

@ -147,9 +147,9 @@
[:div {:class (stl/css :modal-footer)}
[:div {:class (stl/css :action-buttons)}
[:input {:class (stl/css :cancel-button)
:type "button"
:value (tr "labels.cancel")
:on-click cancel-fn}]
:type "button"
:value (tr "labels.cancel")
:on-click cancel-fn}]
[:input {:class (stl/css-case :accept-btn true
:btn-disabled (or in-progress? all-unchecked?))

10
frontend/src/app/main/ui/frame_preview.cljs
View file

@ -13,14 +13,14 @@
{::mf/wrap-props false
::mf/wrap [mf/memo]}
[]
(let [iframe-ref (mf/use-ref nil)
last-data* (mf/use-state nil)
zoom-ref (mf/use-ref nil)
zoom* (mf/use-state 1)
zoom @zoom*
handle-load
(mf/use-callback
@ -33,7 +33,7 @@
(-> iframe-dom .-contentWindow .-document .open)
(-> iframe-dom .-contentWindow .-document (.write data))
(-> iframe-dom .-contentWindow .-document .close)))))
load-ref
(mf/use-callback
(fn [iframe-dom]
@ -54,7 +54,7 @@
(fn []
(aset js/window "load" handle-load)
#(js-delete js/window "load")))
[:div {:style {:display "flex" :width "100%" :height "100%" :flex-direction "column" :overflow "auto" :align-items "center"}}
[:input {:id "zoom-input"
:ref zoom-ref
@ -65,6 +65,6 @@
[:div {:style {:width "100%" :height "100%" :overflow "auto"}}
[:iframe {:ref load-ref
:frame-border "0"
:scrolling "no"
:scrolling "no"
:style {:transform-origin "top left"
:transform (str "scale(" zoom ")")}}]]]))

10
frontend/src/app/main/ui/hooks.cljs
View file

@ -385,11 +385,11 @@
mnt? (volatile! true)
sub (->> (wapi/observe-resize node)
(rx/subs! (fn [entries]
(let [row (first entries)
row-rect (.-contentRect ^js row)
row-width (.-width ^js row-rect)]
(when @mnt?
(reset! width* row-width))))))]
(let [row (first entries)
row-rect (.-contentRect ^js row)
row-width (.-width ^js row-rect)]
(when @mnt?
(reset! width* row-width))))))]
(fn []
(vreset! mnt? false)
(rx/dispose! sub))))

46
frontend/src/app/main/ui/measurements.cljs
View file

@ -96,18 +96,18 @@
(or (and (neg? ss) (pos? se))
(and (pos? ss) (neg? ee))
(and (neg? ss) (> ss se)))
(conj [ from-s (+ from-s ss) ])
(conj [from-s (+ from-s ss)])
(and (neg? se) (<= ss se))
(conj [ from-s (+ from-s se) ])
(conj [from-s (+ from-s se)])
(and (pos? es) (<= es ee))
(conj [ from-e (+ from-e es) ])
(conj [from-e (+ from-e es)])
(or (and (pos? ee) (neg? es))
(and (neg? ee) (pos? ss))
(and (pos? ee) (< ee es)))
(conj [ from-e (+ from-e ee) ]))))
(conj [from-e (+ from-e ee)]))))
;; ------------------------------------------------
;; COMPONENTS
@ -383,9 +383,9 @@
pill-width (/ flex-display-pill-width zoom)
pill-height (/ flex-display-pill-height zoom)
hover? #(or hover-all?
(and (or (= % :p1) (= % :p3)) hover-v?)
(and (or (= % :p2) (= % :p4)) hover-h?)
(= @hover %))
(and (or (= % :p1) (= % :p3)) hover-v?)
(and (or (= % :p2) (= % :p4)) hover-h?)
(= @hover %))
negate {:p1 (if (:flip-y frame) true false)
:p2 (if (:flip-x frame) true false)
:p3 (if (:flip-y frame) true false)
@ -459,7 +459,7 @@
:value @hover-value}])]))
(mf/defc margin-display [{:keys [shape-id zoom hover-all? hover-v? hover-h? margin-num margin on-pointer-enter on-pointer-leave
rect-data hover? selected? mouse-pos hover-value]}]
rect-data hover? selected? mouse-pos hover-value]}]
(let [resizing? (mf/use-var false)
start (mf/use-var nil)
original-value (mf/use-var 0)
@ -582,7 +582,7 @@
:resize-negate? (:flip-x frame)}}]
[:g.margins {:pointer-events "visible"}
(for [[margin-num rect-data] margin-display-data]
(for [[margin-num rect-data] margin-display-data]
[:& margin-display
{:key (:key rect-data)
:shape-id shape-id
@ -611,7 +611,7 @@
:value @hover-value}])]))
(mf/defc gap-display [{:keys [frame-id zoom gap-type gap on-pointer-enter on-pointer-leave
rect-data hover? selected? mouse-pos hover-value]}]
rect-data hover? selected? mouse-pos hover-value]}]
(let [resizing (mf/use-var nil)
start (mf/use-var nil)
original-value (mf/use-var 0)
@ -654,19 +654,19 @@
(reset! hover-value val)
(st/emit! (dwm/set-modifiers modifiers)))))))]
[:rect.gap-rect {:x (:x rect-data)
:y (:y rect-data)
:width (:width rect-data)
:height (:height rect-data)
:on-pointer-enter on-pointer-enter
:on-pointer-leave on-pointer-leave
:on-pointer-down on-pointer-down
:on-lost-pointer-capture on-lost-pointer-capture
:on-pointer-move on-pointer-move
:class (when (or hover? selected?)
(if (= (:resize-axis rect-data) :x) (cur/get-dynamic "resize-ew" 0) (cur/get-dynamic "resize-ew" 90)))
:style {:fill (if (or hover? selected?) distance-color "none")
:opacity (if selected? 0.5 0.25)}}]))
[:rect.gap-rect {:x (:x rect-data)
:y (:y rect-data)
:width (:width rect-data)
:height (:height rect-data)
:on-pointer-enter on-pointer-enter
:on-pointer-leave on-pointer-leave
:on-pointer-down on-pointer-down
:on-lost-pointer-capture on-lost-pointer-capture
:on-pointer-move on-pointer-move
:class (when (or hover? selected?)
(if (= (:resize-axis rect-data) :x) (cur/get-dynamic "resize-ew" 0) (cur/get-dynamic "resize-ew" 90)))
:style {:fill (if (or hover? selected?) distance-color "none")
:opacity (if selected? 0.5 0.25)}}]))
(mf/defc gap-rects [{:keys [frame zoom]}]
(let [frame-id (:id frame)

4
frontend/src/app/main/ui/onboarding/questions.cljs
View file

@ -93,7 +93,7 @@
(s/def ::questions-form-step-3
(s/keys :req-un [::experience-design-tool]
:opt-un[::experience-design-tool-other]))
:opt-un [::experience-design-tool-other]))
(defn- step-3-form-validator
[errors data]
@ -134,7 +134,7 @@
(s/def ::questions-form-step-4
(s/keys :req-un [::team-size ::role]
:opt-un [::role-other]))
:opt-un [::role-other]))
(defn- step-4-form-validator
[errors data]

10
frontend/src/app/main/ui/onboarding/templates.cljs
View file

@ -40,11 +40,11 @@
(reset! downloading? true)
(->> (http/send! {:method :get :uri link :response-type :blob :mode :no-cors})
(rx/subs! (fn [{:keys [body] :as response}]
(open-import-modal {:name name :uri (wapi/create-uri body)}))
(fn [error]
(js/console.log "error" error))
(fn []
(reset! downloading? false)))))]
(open-import-modal {:name name :uri (wapi/create-uri body)}))
(fn [error]
(js/console.log "error" error))
(fn []
(reset! downloading? false)))))]
[:div.template-item
[:div.template-item-content

14
frontend/src/app/main/ui/routes.cljs
View file

@ -113,15 +113,15 @@
;; invitations workflows (and probably other cases).
(->> (rp/cmd! :get-profile)
(rx/subs! (fn [{:keys [id] :as profile}]
(cond
(= id uuid/zero)
(st/emit! (rt/nav :auth-login))
(cond
(= id uuid/zero)
(st/emit! (rt/nav :auth-login))
empty-path?
(st/emit! (rt/nav :dashboard-projects {:team-id (du/get-current-team-id profile)}))
empty-path?
(st/emit! (rt/nav :dashboard-projects {:team-id (du/get-current-team-id profile)}))
:else
(st/emit! (rt/assign-exception {:type :not-found})))))))))
:else
(st/emit! (rt/assign-exception {:type :not-found})))))))))
(defn init-routes
[]

17
frontend/src/app/main/ui/settings/change_email.cljs
View file

@ -89,13 +89,13 @@
on-email-change
(mf/use-callback
(fn [_ _]
(let [different-emails-error? (= (dma/get-in @form [:errors :email-2 :code]) :different-emails)
email-1 (dma/get-in @form [:clean-data :email-1])
email-2 (dma/get-in @form [:clean-data :email-2])]
(println "different-emails-error?" (and different-emails-error? (= email-1 email-2)))
(when (and different-emails-error? (= email-1 email-2))
(swap! form d/dissoc-in [:errors :email-2])))))]
(fn [_ _]
(let [different-emails-error? (= (dma/get-in @form [:errors :email-2 :code]) :different-emails)
email-1 (dma/get-in @form [:clean-data :email-1])
email-2 (dma/get-in @form [:clean-data :email-2])]
(println "different-emails-error?" (and different-emails-error? (= email-1 email-2)))
(when (and different-emails-error? (= email-1 email-2))
(swap! form d/dissoc-in [:errors :email-2])))))]
[:div {:class (stl/css :modal-overlay)}
[:div {:class (stl/css :modal-container)}
@ -134,8 +134,7 @@
[:div {:class (stl/css :action-buttons)
:data-test "change-email-submit"}
[:> fm/submit-button*
{:label (tr "modals.change-email.submit")}]]]]]]
))
{:label (tr "modals.change-email.submit")}]]]]]]))

12
frontend/src/app/main/ui/settings/options.cljs
View file

@ -75,11 +75,11 @@
(mf/defc options-page
[]
(mf/use-effect
#(dom/set-html-title (tr "title.settings.options")))
(mf/use-effect
#(dom/set-html-title (tr "title.settings.options")))
[:div {:class (stl/css :dashboard-settings)}
[:div {:class (stl/css :form-container) :data-test "settings-form"}
[:h2 (tr "labels.settings")]
[:& options-form {}]]])
[:div {:class (stl/css :dashboard-settings)}
[:div {:class (stl/css :form-container) :data-test "settings-form"}
[:h2 (tr "labels.settings")]
[:& options-form {}]]])

36
frontend/src/app/main/ui/settings/sidebar.cljs
View file

@ -30,42 +30,42 @@
go-dashboard
(mf/use-callback
(mf/deps profile)
#(st/emit! (rt/nav :dashboard-projects {:team-id (du/get-current-team-id profile)})))
(mf/deps profile)
#(st/emit! (rt/nav :dashboard-projects {:team-id (du/get-current-team-id profile)})))
go-settings-profile
(mf/use-callback
(mf/deps profile)
#(st/emit! (rt/nav :settings-profile)))
(mf/deps profile)
#(st/emit! (rt/nav :settings-profile)))
go-settings-feedback
(mf/use-callback
(mf/deps profile)
#(st/emit! (rt/nav :settings-feedback)))
(mf/deps profile)
#(st/emit! (rt/nav :settings-feedback)))
go-settings-password
(mf/use-callback
(mf/deps profile)
#(st/emit! (rt/nav :settings-password)))
(mf/deps profile)
#(st/emit! (rt/nav :settings-password)))
go-settings-options
(mf/use-callback
(mf/deps profile)
#(st/emit! (rt/nav :settings-options)))
(mf/deps profile)
#(st/emit! (rt/nav :settings-options)))
go-settings-access-tokens
(mf/use-callback
(mf/deps profile)
#(st/emit! (rt/nav :settings-access-tokens)))
(mf/deps profile)
#(st/emit! (rt/nav :settings-access-tokens)))
show-release-notes
(mf/use-callback
(fn [event]
(let [version (:main cf/version)]
(st/emit! (ptk/event ::ev/event {::ev/name "show-release-notes" :version version}))
(if (and (kbd/alt? event) (kbd/mod? event))
(st/emit! (modal/show {:type :onboarding}))
(st/emit! (modal/show {:type :release-notes :version version}))))))]
(fn [event]
(let [version (:main cf/version)]
(st/emit! (ptk/event ::ev/event {::ev/name "show-release-notes" :version version}))
(if (and (kbd/alt? event) (kbd/mod? event))
(st/emit! (modal/show {:type :onboarding}))
(st/emit! (modal/show {:type :release-notes :version version}))))))]
[:div {:class (stl/css :sidebar-content)}
[:div {:class (stl/css :sidebar-content-section)}

24
frontend/src/app/main/ui/shapes/attrs.cljs
View file

@ -144,7 +144,7 @@
(not= caps-start caps-end)))
(obj/set! attrs "markerEnd" (str/ffmt "url(#marker-%-%)" render-id (name caps-end))))))))
attrs))
attrs))
(defn add-layer-styles!
[props shape]
@ -197,15 +197,15 @@
(add-layer-styles! shape))
url-fill? (or ^boolean (some? (:fill-image shape))
^boolean (cfh/image-shape? shape)
^boolean (> (count shape-fills) 1)
^boolean (some? (some :fill-color-gradient shape-fills))
^boolean (some? (some :fill-image shape-fills)))
^boolean (cfh/image-shape? shape)
^boolean (> (count shape-fills) 1)
^boolean (some? (some :fill-color-gradient shape-fills))
^boolean (some? (some :fill-image shape-fills)))
props (if (cfh/frame-shape? shape)
props
(if (or (some? (->> shape-shadow (remove :hidden) seq))
(and (some? shape-blur) (not ^boolean (:hidden shape-blur))))
(and (some? shape-blur) (not ^boolean (:hidden shape-blur))))
(obj/set! props "filter" (dm/fmt "url(#filter-%)" render-id))
props))]
@ -219,9 +219,9 @@
;; reset to normal if a Penpot frame shape appears below
;; (see main.ui.shapes.frame/frame-container).
(and ^boolean (contains? shape :svg-attrs)
^boolean (or ^boolean (= :svg-raw shape-type)
^boolean (= :group shape-type))
^boolean (empty? shape-fills))
^boolean (or ^boolean (= :svg-raw shape-type)
^boolean (= :group shape-type))
^boolean (empty? shape-fills))
(let [wstyle (get shape :wrapper-styles)
fill (obj/get wstyle "fill")
fill (d/nilv fill clr/black)]
@ -234,7 +234,7 @@
(obj/set! props "fill" (dm/fmt "url(#fill-%-%)" position render-id)))
(and ^boolean (some? svg-styles)
^boolean (obj/contains? svg-styles "fill"))
^boolean (obj/contains? svg-styles "fill"))
(let [fill (obj/get svg-styles "fill")
opacity (obj/get svg-styles "fillOpacity")]
(when (some? fill)
@ -243,7 +243,7 @@
(obj/set! style "fillOpacity" opacity)))
(and ^boolean (some? svg-attrs)
^boolean (empty? shape-fills))
^boolean (empty? shape-fills))
(let [fill (obj/get svg-attrs "fill")
opacity (obj/get svg-attrs "fillOpacity")]
(when (some? fill)
@ -256,7 +256,7 @@
(obj/merge! style (get-fill-style fill render-id 0 shape-type)))
(and ^boolean (cfh/path-shape? shape)
^boolean (empty? shape-fills))
^boolean (empty? shape-fills))
(obj/set! style "fill" "none"))
(-> props

178
frontend/src/app/main/ui/shapes/custom_stroke.cljs
View file

@ -105,106 +105,106 @@
(:stroke-opacity stroke))]
[:*
(when (or (= cap-start :line-arrow)
(= cap-end :line-arrow))
[:marker {:id (dm/str id-prefix "-line-arrow")
:viewBox "0 0 3 6"
:refX "2"
:refY "3"
:markerWidth "8.5"
:markerHeight "8.5"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:path {:d "M 0.5 0.5 L 3 3 L 0.5 5.5 L 0 5 L 2 3 L 0 1 z"}]])
(when (or (= cap-start :line-arrow)
(= cap-end :line-arrow))
[:marker {:id (dm/str id-prefix "-line-arrow")
:viewBox "0 0 3 6"
:refX "2"
:refY "3"
:markerWidth "8.5"
:markerHeight "8.5"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:path {:d "M 0.5 0.5 L 3 3 L 0.5 5.5 L 0 5 L 2 3 L 0 1 z"}]])
(when (or (= cap-start :triangle-arrow)
(= cap-end :triangle-arrow))
[:marker {:id (dm/str id-prefix "-triangle-arrow")
:viewBox "0 0 3 6"
:refX "2"
:refY "3"
:markerWidth "8.5"
:markerHeight "8.5"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:path {:d "M 0 0 L 3 3 L 0 6 z"}]])
(when (or (= cap-start :triangle-arrow)
(= cap-end :triangle-arrow))
[:marker {:id (dm/str id-prefix "-triangle-arrow")
:viewBox "0 0 3 6"
:refX "2"
:refY "3"
:markerWidth "8.5"
:markerHeight "8.5"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:path {:d "M 0 0 L 3 3 L 0 6 z"}]])
(when (or (= cap-start :square-marker)
(= cap-end :square-marker))
[:marker {:id (dm/str id-prefix "-square-marker")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "4.2426" ;; diagonal length of a 3x3 square
:markerHeight "4.2426"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:rect {:x 0 :y 0 :width 6 :height 6}]])
(when (or (= cap-start :square-marker)
(= cap-end :square-marker))
[:marker {:id (dm/str id-prefix "-square-marker")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "4.2426" ;; diagonal length of a 3x3 square
:markerHeight "4.2426"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:rect {:x 0 :y 0 :width 6 :height 6}]])
(when (or (= cap-start :circle-marker)
(= cap-end :circle-marker))
[:marker {:id (dm/str id-prefix "-circle-marker")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "4"
:markerHeight "4"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:circle {:cx "3" :cy "3" :r "3"}]])
(when (or (= cap-start :circle-marker)
(= cap-end :circle-marker))
[:marker {:id (dm/str id-prefix "-circle-marker")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "4"
:markerHeight "4"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:circle {:cx "3" :cy "3" :r "3"}]])
(when (or (= cap-start :diamond-marker)
(= cap-end :diamond-marker))
[:marker {:id (dm/str id-prefix "-diamond-marker")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "6"
:markerHeight "6"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:path {:d "M 3 0 L 6 3 L 3 6 L 0 3 z"}]])
(when (or (= cap-start :diamond-marker)
(= cap-end :diamond-marker))
[:marker {:id (dm/str id-prefix "-diamond-marker")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "6"
:markerHeight "6"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:path {:d "M 3 0 L 6 3 L 3 6 L 0 3 z"}]])
;; If the user wants line caps but different in each end,
;; simulate it with markers.
(when (and (or (= cap-start :round)
(= cap-end :round))
(not= cap-start cap-end))
[:marker {:id (dm/str id-prefix "-round")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "6"
:markerHeight "6"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:path {:d "M 3 2.5 A 0.5 0.5 0 0 1 3 3.5 "}]])
(when (and (or (= cap-start :round)
(= cap-end :round))
(not= cap-start cap-end))
[:marker {:id (dm/str id-prefix "-round")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "6"
:markerHeight "6"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:path {:d "M 3 2.5 A 0.5 0.5 0 0 1 3 3.5 "}]])
(when (and (or (= cap-start :square)
(= cap-end :square))
(not= cap-start cap-end))
[:marker {:id (dm/str id-prefix "-square")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "6"
:markerHeight "6"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:rect {:x 3 :y 2.5 :width 0.5 :height 1}]])]))
(when (and (or (= cap-start :square)
(= cap-end :square))
(not= cap-start cap-end))
[:marker {:id (dm/str id-prefix "-square")
:viewBox "0 0 6 6"
:refX "3"
:refY "3"
:markerWidth "6"
:markerHeight "6"
:orient "auto-start-reverse"
:fill color
:fillOpacity opacity}
[:rect {:x 3 :y 2.5 :width 0.5 :height 1}]])]))
(mf/defc stroke-defs
{::mf/wrap-props false}
[{:keys [shape stroke render-id index]}]
(let [open-path? (and ^boolean (cfh/path-shape? shape)
^boolean (gsh/open-path? shape))
^boolean (gsh/open-path? shape))
gradient (:stroke-color-gradient stroke)
alignment (:stroke-alignment stroke :center)
width (:stroke-width stroke 0)
@ -487,11 +487,11 @@
props
(cond-> props
(and (some? shape-blur)
(not ^boolean (:hidden shape-blur)))
(not ^boolean (:hidden shape-blur)))
(obj/set! "filter" (dm/fmt "url(#filter-blur-%)" render-id))
(and (empty? shape-fills)
(some? (->> shape-shadow (remove :hidden) seq)))
(some? (->> shape-shadow (remove :hidden) seq)))
(obj/set! "filter" (dm/fmt "url(#filter-%)" render-id))))]
(when (d/not-empty? shape-strokes)

6
frontend/src/app/main/ui/shapes/embed.cljs
View file

@ -38,9 +38,9 @@
(url-mapping)
(rx/reduce conj {})
(rx/subs! (fn [data]
(when-not (= data (mf/ref-val uri-data))
(mf/set-ref-val! uri-data data)
(reset! state inc)))))]
(when-not (= data (mf/ref-val uri-data))
(mf/set-ref-val! uri-data data)
(reset! state inc)))))]
#(when sub
(rx/dispose! sub)))))

76
frontend/src/app/main/ui/shapes/export.cljs
View file

@ -169,10 +169,10 @@
(mf/defc export-flows
[{:keys [flows]}]
[:> "penpot:flows" #js {}
(for [{:keys [id name starting-frame]} flows]
[:> "penpot:flow" #js {:id id
:name name
:starting-frame starting-frame}])])
(for [{:keys [id name starting-frame]} flows]
[:> "penpot:flow" #js {:id id
:name name
:starting-frame starting-frame}])])
(mf/defc export-guides
[{:keys [guides]}]
@ -253,7 +253,7 @@
[:*
(when (contains? shape :svg-attrs)
(let [svg-transform (get shape :svg-transform)
svg-attrs (->> shape :svg-attrs keys (mapv d/name) (str/join ",") )
svg-attrs (->> shape :svg-attrs keys (mapv d/name) (str/join ","))
svg-defs (->> shape :svg-defs keys (mapv d/name) (str/join ","))]
[:> "penpot:svg-import"
#js {:penpot:svg-attrs (when-not (empty? svg-attrs) svg-attrs)
@ -292,47 +292,47 @@
(when-let [fills (seq fills)]
(let [render-id (mf/use-ctx muc/render-id)]
(mf/html
[:> "penpot:fills" #js {}
(for [[index fill] (d/enumerate fills)]
(let [fill-image-id (dm/str "fill-image-" render-id "-" index)]
[:> "penpot:fill"
#js {:penpot:fill-color (cond
(some? (:fill-color-gradient fill))
(str/format "url(#%s)" (str "fill-color-gradient-" render-id "-" index))
[:> "penpot:fills" #js {}
(for [[index fill] (d/enumerate fills)]
(let [fill-image-id (dm/str "fill-image-" render-id "-" index)]
[:> "penpot:fill"
#js {:penpot:fill-color (cond
(some? (:fill-color-gradient fill))
(str/format "url(#%s)" (str "fill-color-gradient-" render-id "-" index))
:else
(d/name (:fill-color fill)))
:key (swap! internal-counter inc)
:else
(d/name (:fill-color fill)))
:key (swap! internal-counter inc)
:penpot:fill-image-id (when (:fill-image fill) fill-image-id)
:penpot:fill-color-ref-file (d/name (:fill-color-ref-file fill))
:penpot:fill-color-ref-id (d/name (:fill-color-ref-id fill))
:penpot:fill-opacity (d/name (:fill-opacity fill))}]))]))))
:penpot:fill-image-id (when (:fill-image fill) fill-image-id)
:penpot:fill-color-ref-file (d/name (:fill-color-ref-file fill))
:penpot:fill-color-ref-id (d/name (:fill-color-ref-id fill))
:penpot:fill-opacity (d/name (:fill-opacity fill))}]))]))))
(defn- export-strokes-data [{:keys [strokes]}]
(when-let [strokes (seq strokes)]
(let [render-id (mf/use-ctx muc/render-id)]
(mf/html
[:> "penpot:strokes" #js {}
(for [[index stroke] (d/enumerate strokes)]
(let [stroke-image-id (dm/str "stroke-image-" render-id "-" index)]
[:> "penpot:stroke"
#js {:penpot:stroke-color (cond
(some? (:stroke-color-gradient stroke))
(str/format "url(#%s)" (str "stroke-color-gradient-" render-id "-" index))
[:> "penpot:strokes" #js {}
(for [[index stroke] (d/enumerate strokes)]
(let [stroke-image-id (dm/str "stroke-image-" render-id "-" index)]
[:> "penpot:stroke"
#js {:penpot:stroke-color (cond
(some? (:stroke-color-gradient stroke))
(str/format "url(#%s)" (str "stroke-color-gradient-" render-id "-" index))
:else
(d/name (:stroke-color stroke)))
:key (swap! internal-counter inc)
:penpot:stroke-image-id (when (:stroke-image stroke) stroke-image-id)
:penpot:stroke-color-ref-file (d/name (:stroke-color-ref-file stroke))
:penpot:stroke-color-ref-id (d/name (:stroke-color-ref-id stroke))
:penpot:stroke-opacity (d/name (:stroke-opacity stroke))
:penpot:stroke-style (d/name (:stroke-style stroke))
:penpot:stroke-width (d/name (:stroke-width stroke))
:penpot:stroke-alignment (d/name (:stroke-alignment stroke))
:penpot:stroke-cap-start (d/name (:stroke-cap-start stroke))
:penpot:stroke-cap-end (d/name (:stroke-cap-end stroke))}]))]))))
:else
(d/name (:stroke-color stroke)))
:key (swap! internal-counter inc)
:penpot:stroke-image-id (when (:stroke-image stroke) stroke-image-id)
:penpot:stroke-color-ref-file (d/name (:stroke-color-ref-file stroke))
:penpot:stroke-color-ref-id (d/name (:stroke-color-ref-id stroke))
:penpot:stroke-opacity (d/name (:stroke-opacity stroke))
:penpot:stroke-style (d/name (:stroke-style stroke))
:penpot:stroke-width (d/name (:stroke-width stroke))
:penpot:stroke-alignment (d/name (:stroke-alignment stroke))
:penpot:stroke-cap-start (d/name (:stroke-cap-start stroke))
:penpot:stroke-cap-end (d/name (:stroke-cap-end stroke))}]))]))))
(defn- export-interactions-data [{:keys [interactions]}]
(when-let [interactions (seq interactions)]

14
frontend/src/app/main/ui/shapes/fills.cljs
View file

@ -35,7 +35,7 @@
height (dm/get-prop selrect :height)
has-image? (or (some? metadata)
(some? image))
(some? image))
uri (cond
(some? metadata)
@ -45,10 +45,10 @@
(cf/resolve-file-media image))
uris (into [uri]
(comp
(keep :fill-image)
(map cf/resolve-file-media))
fills)
(comp
(keep :fill-image)
(map cf/resolve-file-media))
fills)
transform (gsh/transform-str shape)
@ -59,8 +59,8 @@
:height height}
pat-props (if (= :path type)
(obj/set! pat-props "patternTransform" transform)
pat-props)]
(obj/set! pat-props "patternTransform" transform)
pat-props)]
(for [[shape-index shape] (d/enumerate (or (:position-data shape) [shape]))]
[:* {:key (dm/str shape-index)}

4
frontend/src/app/main/ui/shapes/mask.cljs
View file

@ -60,8 +60,8 @@
points (dm/get-prop mask :points)
points-str (mf/with-memo [points]
(->> (map point->str points)
(str/join " ")))
(->> (map point->str points)
(str/join " ")))
bounds (mf/with-memo [points]
(grc/points->rect points))

6
frontend/src/app/main/ui/shapes/path.cljs
View file

@ -22,9 +22,9 @@
(upf/format-path content)
(catch :default e
(log/error :hint "unexpected error on formatting path"
:shape-name (:name shape)
:shape-id (:id shape)
:cause e)
:shape-name (:name shape)
:shape-id (:id shape)
:cause e)
"")))
props (-> #js {}

10
frontend/src/app/main/ui/shapes/svg_defs.cljs
View file

@ -59,11 +59,11 @@
(= :group type))
(update :className #(if % (dm/str % " svg-def") "svg-def")))
(cond->
transform-gradient? (add-matrix :gradientTransform transform)
transform-pattern? (add-matrix :patternTransform transform)
transform-clippath? (add-matrix :transform transform)
(or transform-filter?
transform-mask?) (merge bounds)))
transform-gradient? (add-matrix :gradientTransform transform)
transform-pattern? (add-matrix :patternTransform transform)
transform-clippath? (add-matrix :transform transform)
(or transform-filter?
transform-mask?) (merge bounds)))
;; Fixes race condition with dynamic modifiers forcing redraw this properties before
;; the effect triggers

2
frontend/src/app/main/ui/shapes/svg_raw.cljs
View file

@ -83,7 +83,7 @@
(usa/add-fill-props! shape render-id))]
(when (and (some? element-id)
(contains? ids-mapping element-id))
(contains? ids-mapping element-id))
(obj/set! props "id" (get ids-mapping element-id)))
props))]

2
frontend/src/app/main/ui/shapes/text/fo_text.cljs
View file

@ -196,7 +196,7 @@
;; We use a class here because react has a bug that won't use the appropriate selector for
;; `background-clip`
[:style ".text-node { background-clip: text;
-webkit-background-clip: text; }" ]
-webkit-background-clip: text; }"]
[:& render-node {:index 0
:shape shape
:node content}]]))

2
frontend/src/app/main/ui/shapes/text/html_text.cljs
View file

@ -121,7 +121,7 @@
;; `background-clip`
(when (not code?)
[:style ".text-node { background-clip: text;
-webkit-background-clip: text; }" ])
-webkit-background-clip: text; }"])
[:& render-node {:index 0
:shape shape
:node content

2
frontend/src/app/main/ui/viewer.cljs
View file

@ -121,7 +121,7 @@
[{:keys [section index users frame page]}]
(let [comments-local (mf/deref refs/comments-local)
show-sidebar? (and (= section :comments) (:show-sidebar? comments-local))]
[:*
[:*
[:& viewer-pagination
{:index index
:num-frames (count (:frames page))

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

@ -40,7 +40,7 @@
(let [mode (-> (dom/get-current-target event)
(dom/get-data "value")
(keyword))]
(st/emit! (dcm/update-filters {:mode mode})))))
(st/emit! (dcm/update-filters {:mode mode})))))
update-show
(mf/use-callback
@ -48,7 +48,7 @@
(let [mode (-> (dom/get-current-target event)
(dom/get-data "value")
(d/read-string))]
(st/emit! (dcm/update-filters {:show mode})))))
(st/emit! (dcm/update-filters {:show mode})))))
update-options
(mf/use-callback

12
frontend/src/app/main/ui/viewer/header.cljs
View file

@ -275,13 +275,13 @@
(mf/use-fn
(mf/deps permissions)
(fn [event]
(let [section (-> (dom/get-current-target event)
(dom/get-data "value")
(keyword))]
(let [section (-> (dom/get-current-target event)
(dom/get-data "value")
(keyword))]
(if (or (= section :interactions) (:is-logged permissions))
(st/emit! (dv/go-to-section section))
(open-login-dialog)))))]
(if (or (= section :interactions) (:is-logged permissions))
(st/emit! (dv/go-to-section section))
(open-login-dialog)))))]
[:header {:class (stl/css :viewer-header)}
[:div {:class (stl/css :nav-zone)}

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

@ -80,7 +80,7 @@
handle-expand
(mf/use-callback
(mf/deps right-size)
(fn[]
(fn []
(set-right-size (if (> right-size 276) 276 768))))]
(mf/use-effect on-mount)

206
frontend/src/app/main/ui/viewer/shapes.cljs
View file

@ -148,7 +148,7 @@
(if (= (:type shape) :frame) ;; manual interactions are always from "self"
(:frame-id shape)
(:id shape))
(:position-relative-to interaction))
(:position-relative-to interaction))
relative-to-shape (or (get objects relative-to-id) base-frame)
overlays-ids (set (map :id overlays))
relative-to-base-frame (find-relative-to-base-frame relative-to-shape objects overlays-ids base-frame)
@ -278,68 +278,68 @@
"Wrap some svg shape and add interaction controls"
[component]
(mf/fnc generic-wrapper
{::mf/wrap-props false}
[props]
(let [shape (unchecked-get props "shape")
childs (unchecked-get props "childs")
frame (unchecked-get props "frame")
objects (unchecked-get props "objects")
all-objects (or (unchecked-get props "all-objects") objects)
base-frame (mf/use-ctx base-frame-ctx)
frame-offset (mf/use-ctx frame-offset-ctx)
interactions-show? (mf/deref viewer-interactions-show?)
overlays (mf/deref refs/viewer-overlays)
interactions (:interactions shape)
svg-element? (and (= :svg-raw (:type shape))
(not= :svg (get-in shape [:content :tag])))
{::mf/wrap-props false}
[props]
(let [shape (unchecked-get props "shape")
childs (unchecked-get props "childs")
frame (unchecked-get props "frame")
objects (unchecked-get props "objects")
all-objects (or (unchecked-get props "all-objects") objects)
base-frame (mf/use-ctx base-frame-ctx)
frame-offset (mf/use-ctx frame-offset-ctx)
interactions-show? (mf/deref viewer-interactions-show?)
overlays (mf/deref refs/viewer-overlays)
interactions (:interactions shape)
svg-element? (and (= :svg-raw (:type shape))
(not= :svg (get-in shape [:content :tag])))
;; The objects parameter has the shapes that we must draw. It may be a subset of
;; all-objects in some cases (e.g. if there are fixed elements). But for interactions
;; handling we need access to all objects inside the page.
;; The objects parameter has the shapes that we must draw. It may be a subset of
;; all-objects in some cases (e.g. if there are fixed elements). But for interactions
;; handling we need access to all objects inside the page.
on-pointer-down
(mf/use-fn (mf/deps shape base-frame frame-offset all-objects)
#(on-pointer-down % shape base-frame frame-offset all-objects overlays))
on-pointer-down
(mf/use-fn (mf/deps shape base-frame frame-offset all-objects)
#(on-pointer-down % shape base-frame frame-offset all-objects overlays))
on-pointer-up
(mf/use-fn (mf/deps shape base-frame frame-offset all-objects)
#(on-pointer-up % shape base-frame frame-offset all-objects overlays))
on-pointer-up
(mf/use-fn (mf/deps shape base-frame frame-offset all-objects)
#(on-pointer-up % shape base-frame frame-offset all-objects overlays))
on-pointer-enter
(mf/use-fn (mf/deps shape base-frame frame-offset all-objects)
#(on-pointer-enter % shape base-frame frame-offset all-objects overlays))
on-pointer-enter
(mf/use-fn (mf/deps shape base-frame frame-offset all-objects)
#(on-pointer-enter % shape base-frame frame-offset all-objects overlays))
on-pointer-leave
(mf/use-fn (mf/deps shape base-frame frame-offset all-objects)
#(on-pointer-leave % shape base-frame frame-offset all-objects overlays))]
on-pointer-leave
(mf/use-fn (mf/deps shape base-frame frame-offset all-objects)
#(on-pointer-leave % shape base-frame frame-offset all-objects overlays))]
(mf/with-effect []
(let [sems (on-load shape base-frame frame-offset objects overlays)]
(partial run! tm/dispose! sems)))
(mf/with-effect []
(let [sems (on-load shape base-frame frame-offset objects overlays)]
(partial run! tm/dispose! sems)))
(if-not svg-element?
[:> shape-container {:shape shape
:cursor (when (ctsi/actionable? interactions) "pointer")
:on-pointer-down on-pointer-down
:on-pointer-up on-pointer-up
:on-pointer-enter on-pointer-enter
:on-pointer-leave on-pointer-leave}
(if-not svg-element?
[:> shape-container {:shape shape
:cursor (when (ctsi/actionable? interactions) "pointer")
:on-pointer-down on-pointer-down
:on-pointer-up on-pointer-up
:on-pointer-enter on-pointer-enter
:on-pointer-leave on-pointer-leave}
[:& component {:shape shape
:frame frame
:childs childs
:is-child-selected? true
:objects objects}]
[:& component {:shape shape
:frame frame
:childs childs
:is-child-selected? true
:objects objects}]
[:& interaction {:shape shape
:interactions interactions
:interactions-show? interactions-show?}]]
[:& interaction {:shape shape
:interactions interactions
:interactions-show? interactions-show?}]]
;; Don't wrap svg elements inside a <g> otherwise some can break
[:& component {:shape shape
:frame frame
:childs childs
:objects objects}]))))
[:& component {:shape shape
:frame frame
:childs childs
:objects objects}]))))
(defn frame-wrapper
[shape-container]
@ -400,41 +400,41 @@
(let [shape-container (shape-container-factory objects all-objects)
group-wrapper (group-wrapper shape-container)]
(mf/fnc group-container
{::mf/wrap-props false}
[props]
(let [childs (mapv #(get objects %) (:shapes (unchecked-get props "shape")))
props (obj/merge! #js {} props
#js {:childs childs
:objects objects})]
(when (not-empty childs)
[:> group-wrapper props])))))
{::mf/wrap-props false}
[props]
(let [childs (mapv #(get objects %) (:shapes (unchecked-get props "shape")))
props (obj/merge! #js {} props
#js {:childs childs
:objects objects})]
(when (not-empty childs)
[:> group-wrapper props])))))
(defn bool-container-factory
[objects all-objects]
(let [shape-container (shape-container-factory objects all-objects)
bool-wrapper (bool-wrapper shape-container)]
(mf/fnc bool-container
{::mf/wrap-props false}
[props]
(let [childs (->> (cfh/get-children-ids objects (:id (unchecked-get props "shape")))
(select-keys objects))
props (obj/merge! #js {} props
#js {:childs childs
:objects objects})]
[:> bool-wrapper props]))))
{::mf/wrap-props false}
[props]
(let [childs (->> (cfh/get-children-ids objects (:id (unchecked-get props "shape")))
(select-keys objects))
props (obj/merge! #js {} props
#js {:childs childs
:objects objects})]
[:> bool-wrapper props]))))
(defn svg-raw-container-factory
[objects all-objects]
(let [shape-container (shape-container-factory objects all-objects)
svg-raw-wrapper (svg-raw-wrapper shape-container)]
(mf/fnc svg-raw-container
{::mf/wrap-props false}
[props]
(let [childs (mapv #(get objects %) (:shapes (unchecked-get props "shape")))
props (obj/merge! #js {} props
#js {:childs childs
:objects objects})]
[:> svg-raw-wrapper props]))))
{::mf/wrap-props false}
[props]
(let [childs (mapv #(get objects %) (:shapes (unchecked-get props "shape")))
props (obj/merge! #js {} props
#js {:childs childs
:objects objects})]
[:> svg-raw-wrapper props]))))
(defn shape-container-factory
[objects all-objects]
@ -444,28 +444,28 @@
image-wrapper (image-wrapper)
circle-wrapper (circle-wrapper)]
(mf/fnc shape-container
{::mf/wrap-props false
::mf/wrap [mf/memo]}
[props]
(let [shape (unchecked-get props "shape")
frame (unchecked-get props "frame")
{::mf/wrap-props false
::mf/wrap [mf/memo]}
[props]
(let [shape (unchecked-get props "shape")
frame (unchecked-get props "frame")
group-container
(mf/with-memo [objects]
(group-container-factory objects all-objects))
group-container
(mf/with-memo [objects]
(group-container-factory objects all-objects))
frame-container
(mf/with-memo [objects]
(frame-container-factory objects all-objects))
frame-container
(mf/with-memo [objects]
(frame-container-factory objects all-objects))
bool-container
(mf/with-memo [objects]
(bool-container-factory objects all-objects))
bool-container
(mf/with-memo [objects]
(bool-container-factory objects all-objects))
svg-raw-container
(mf/with-memo [objects]
(svg-raw-container-factory objects all-objects))]
(when (and shape (not (:hidden shape)))
svg-raw-container
(mf/with-memo [objects]
(svg-raw-container-factory objects all-objects))]
(when (and shape (not (:hidden shape)))
(let [shape (if frame
(gsh/translate-to-frame shape frame)
shape)
@ -473,13 +473,13 @@
opts #js {:shape shape
:objects objects
:all-objects all-objects}]
(case (:type shape)
:frame [:> frame-container opts]
:text [:> text-wrapper opts]
:rect [:> rect-wrapper opts]
:path [:> path-wrapper opts]
:image [:> image-wrapper opts]
:circle [:> circle-wrapper opts]
:group [:> group-container {:shape shape :frame frame :objects objects}]
:bool [:> bool-container {:shape shape :frame frame :objects objects}]
:svg-raw [:> svg-raw-container {:shape shape :frame frame :objects objects}])))))))
(case (:type shape)
:frame [:> frame-container opts]
:text [:> text-wrapper opts]
:rect [:> rect-wrapper opts]
:path [:> path-wrapper opts]
:image [:> image-wrapper opts]
:circle [:> circle-wrapper opts]
:group [:> group-container {:shape shape :frame frame :objects objects}]
:bool [:> bool-container {:shape shape :frame frame :objects objects}]
:svg-raw [:> svg-raw-container {:shape shape :frame frame :objects objects}])))))))

4
frontend/src/app/main/ui/workspace/color_palette.cljs
View file

@ -26,8 +26,8 @@
(letfn [(select-color [event]
(st/emit! (mdc/apply-color-from-palette color (kbd/alt? event))))]
[:div {:class (stl/css-case :color-cell true
:is-not-library-color (nil? (:id color))
:no-text (<= size 64))
:is-not-library-color (nil? (:id color))
:no-text (<= size 64))
:title (uc/get-color-name color)
:on-click select-color}
[:& cb/color-bullet {:color color}]

4
frontend/src/app/main/ui/workspace/color_palette_ctx_menu.cljs
View file

@ -57,7 +57,7 @@
[:div {:class (stl/css :lib-name-wrapper)}
[:span {:class (stl/css :lib-name)}
(dm/str (tr "workspace.libraries.colors.file-library"))]
(dm/str (tr "workspace.libraries.colors.file-library"))]
[:span {:class (stl/css :lib-num)}
(dm/str "(" (count file-colors) ")")]]
@ -81,7 +81,7 @@
[:span {:class (stl/css :lib-name)}
(dm/str (tr "workspace.libraries.colors.recent-colors"))]
[:span {:class (stl/css :lib-num)}
(dm/str "("(count recent-colors) ")")]]
(dm/str "(" (count recent-colors) ")")]]
(when (= selected :recent)
[:span {:class (stl/css :icon-wrapper)}

14
frontend/src/app/main/ui/workspace/colorpicker.cljs
View file

@ -78,21 +78,21 @@
selected-mode (get state :type :color)
disabled-color-accept? (and
(= selected-mode :image)
(not (:image current-color)))
(= selected-mode :image)
(not (:image current-color)))
on-fill-image-success
(mf/use-fn
(fn [image]
(st/emit! (dc/update-colorpicker-color {:image (select-keys image [:id :width :height :mtype :name])} (not @drag?)))))
(fn [image]
(st/emit! (dc/update-colorpicker-color {:image (select-keys image [:id :width :height :mtype :name])} (not @drag?)))))
on-fill-image-click
(mf/use-callback #(dom/click (mf/ref-val fill-image-ref)))
on-fill-image-selected
(mf/use-fn
(fn [file]
(st/emit! (dwm/upload-fill-image file on-fill-image-success))))
(fn [file]
(st/emit! (dwm/upload-fill-image file on-fill-image-success))))
set-tab!
(mf/use-fn
@ -218,7 +218,7 @@
options
(mf/with-memo [selected-mode disable-gradient disable-image]
(d/concat-vec
(d/concat-vec
[{:value :color :label (tr "media.solid")}]
(when (not disable-gradient)
[{:value :linear-gradient :label (tr "media.linear")}

4
frontend/src/app/main/ui/workspace/colorpicker/libraries.cljs
View file

@ -58,7 +58,7 @@
(-> (dw/toggle-layout-flag :colorpalette)
(vary-meta assoc ::ev/origin "workspace-colorpicker"))))))
shared-libs-options (mapv (fn[lib] {:value (d/name (:id lib)) :label (:name lib)} ) (vals shared-libs))
shared-libs-options (mapv (fn [lib] {:value (d/name (:id lib)) :label (:name lib)}) (vals shared-libs))
library-options [{:value "recent" :label (tr "workspace.libraries.colors.recent-colors")}
@ -69,7 +69,7 @@
on-color-click
(mf/use-fn
(mf/deps state)
(fn[event]
(fn [event]
(on-select-color state event)))]
;; Load library colors when the select is changed

2
frontend/src/app/main/ui/workspace/context_menu.cljs
View file

@ -555,7 +555,7 @@
(mf/deps grid-id type index)
(fn []
(st/emit! (dwsl/remove-layout-track [grid-id] type index {:with-shapes? true}))))]
(if (= type :column)
[:*
[:& menu-entry {:title (tr "workspace.context-menu.grid-track.column.duplicate") :on-click do-duplicate-track}]

4
frontend/src/app/main/ui/workspace/shapes/frame.cljs
View file

@ -42,8 +42,8 @@
(refs/children-objects shape-id))
childs (mf/deref childs-ref)]
[:& shape-container {:shape shape :ref ref :disable-shadows? (cfh/is-direct-child-of-root? shape)}
[:& frame-shape {:shape shape :childs childs}]]))))
[:& shape-container {:shape shape :ref ref :disable-shadows? (cfh/is-direct-child-of-root? shape)}
[:& frame-shape {:shape shape :childs childs}]]))))
(defn check-props
[new-props old-props]

4
frontend/src/app/main/ui/workspace/shapes/frame/dynamic_modifiers.cljs
View file

@ -311,6 +311,4 @@
(reset! prev-modifiers modifiers)
(reset! prev-transforms transforms)
(reset! prev-shapes shapes))
))
(reset! prev-shapes shapes))))

2
frontend/src/app/main/ui/workspace/shapes/text/viewport_texts_html.cljs
View file

@ -308,7 +308,7 @@
;; edited
(mf/use-effect
(fn []
(let [text-nodes (->> text-shapes (vals)(mapcat #(txt/node-seq txt/is-text-node? (:content %))))
(let [text-nodes (->> text-shapes (vals) (mapcat #(txt/node-seq txt/is-text-node? (:content %))))
fonts (into #{} (keep :font-id) text-nodes)]
(run! fonts/ensure-loaded! fonts))))

2
frontend/src/app/main/ui/workspace/sidebar.cljs
View file

@ -111,7 +111,7 @@
(mf/defc right-sidebar
{::mf/wrap-props false
::mf/wrap [mf/memo]}
[{:keys [layout section file page-id ] :as props}]
[{:keys [layout section file page-id] :as props}]
(let [drawing-tool (:tool (mf/deref refs/workspace-drawing))
is-comments? (= drawing-tool :comments)

42
frontend/src/app/main/ui/workspace/sidebar/assets.cljs
View file

@ -127,31 +127,31 @@
(mf/use-fn #(swap! filters* assoc :open-menu false))
options (into [] (remove nil?
[{:option-name (tr "workspace.assets.box-filter-all")
:id "section-all"
:option-handler on-section-filter-change
:data-test "all"}
[{:option-name (tr "workspace.assets.box-filter-all")
:id "section-all"
:option-handler on-section-filter-change
:data-test "all"}
{:option-name (tr "workspace.assets.components")
:id "section-components"
:option-handler on-section-filter-change
:data-test "components"}
{:option-name (tr "workspace.assets.components")
:id "section-components"
:option-handler on-section-filter-change
:data-test "components"}
(when (not components-v2)
{:option-name (tr "workspace.assets.graphics")
:id "section-graphics"
:option-handler on-section-filter-change
:data-test "graphics"})
(when (not components-v2)
{:option-name (tr "workspace.assets.graphics")
:id "section-graphics"
:option-handler on-section-filter-change
:data-test "graphics"})
{:option-name (tr "workspace.assets.colors")
:id "section-color"
:option-handler on-section-filter-change
:data-test "colors"}
{:option-name (tr "workspace.assets.colors")
:id "section-color"
:option-handler on-section-filter-change
:data-test "colors"}
{:option-name (tr "workspace.assets.typography")
:id "section-typography"
:option-handler on-section-filter-change
:data-test "typographies"}]))]
{:option-name (tr "workspace.assets.typography")
:id "section-typography"
:option-handler on-section-filter-change
:data-test "typographies"}]))]
[:div {:class (stl/css :assets-bar)}
[:div {:class (stl/css :assets-header)}

8
frontend/src/app/main/ui/workspace/sidebar/assets/components.cljs
View file

@ -59,10 +59,10 @@
;; NOTE: We don't schedule the thumbnail generation on idle right now
;; until we can queue and handle thumbnail batching properly.
#_(mf/with-effect []
(when-not (some? thumbnail-uri)
(tm/schedule-on-idle
#(st/emit! (dwl/update-component-thumbnail (:id component) file-id)))))
#_(mf/with-effect []
(when-not (some? thumbnail-uri)
(tm/schedule-on-idle
#(st/emit! (dwl/update-component-thumbnail (:id component) file-id)))))
(mf/defc components-item

112
frontend/src/app/main/ui/workspace/sidebar/assets/typographies.cljs
View file

@ -387,71 +387,71 @@
(partial on-asset-click groups))]
(mf/use-effect
(mf/deps local-data )
(mf/deps local-data)
(fn []
(when (:edit-typography local-data)
(st/emit! #(update % :workspace-global dissoc :edit-typography)))))
[:*
[:& cmm/asset-section {:file-id file-id
:title (tr "workspace.assets.typography")
:section :typographies
:assets-count (count typographies)
:open? open?}
(when local?
[:& cmm/asset-section-block {:role :title-button}
(when-not read-only?
[:button {:class (stl/css :assets-btn)
:on-click add-typography}
i/add-refactor])])
:title (tr "workspace.assets.typography")
:section :typographies
:assets-count (count typographies)
:open? open?}
(when local?
[:& cmm/asset-section-block {:role :title-button}
(when-not read-only?
[:button {:class (stl/css :assets-btn)
:on-click add-typography}
i/add-refactor])])
[:& cmm/asset-section-block {:role :content}
[:& typographies-group {:file-id file-id
:prefix ""
:groups groups
:open-groups open-groups
:force-open? force-open?
:state state
:file file
:local? local?
:selected selected
:editing-id editing-id
:renaming-id renaming-id
:local-data local-data
:on-asset-click on-asset-click
:handle-change handle-change
:apply-typography apply-typography
:on-rename-group on-rename-group
:on-ungroup on-ungroup
:on-context-menu on-context-menu
:selected-full selected-full}]
[:& cmm/asset-section-block {:role :content}
[:& typographies-group {:file-id file-id
:prefix ""
:groups groups
:open-groups open-groups
:force-open? force-open?
:state state
:file file
:local? local?
:selected selected
:editing-id editing-id
:renaming-id renaming-id
:local-data local-data
:on-asset-click on-asset-click
:handle-change handle-change
:apply-typography apply-typography
:on-rename-group on-rename-group
:on-ungroup on-ungroup
:on-context-menu on-context-menu
:selected-full selected-full}]
(if local?
[:& cmm/assets-context-menu
{:on-close on-close-menu
:state @menu-state
:options [(when-not (or multi-typographies? multi-assets?)
{:option-name (tr "workspace.assets.rename")
:id "assets-rename-typography"
:option-handler handle-rename-typography-clicked})
(if local?
[:& cmm/assets-context-menu
{:on-close on-close-menu
:state @menu-state
:options [(when-not (or multi-typographies? multi-assets?)
{:option-name (tr "workspace.assets.rename")
:id "assets-rename-typography"
:option-handler handle-rename-typography-clicked})
(when-not (or multi-typographies? multi-assets?)
{:option-name (tr "workspace.assets.edit")
:id "assets-edit-typography"
:option-handler handle-edit-typography-clicked})
(when-not (or multi-typographies? multi-assets?)
{:option-name (tr "workspace.assets.edit")
:id "assets-edit-typography"
:option-handler handle-edit-typography-clicked})
{:option-name (tr "workspace.assets.delete")
:id "assets-delete-typography"
:option-handler handle-delete-typography}
{:option-name (tr "workspace.assets.delete")
:id "assets-delete-typography"
:option-handler handle-delete-typography}
(when-not multi-assets?
{:option-name (tr "workspace.assets.group")
:id "assets-group-typography"
:option-handler on-group})]}]
(when-not multi-assets?
{:option-name (tr "workspace.assets.group")
:id "assets-group-typography"
:option-handler on-group})]}]
[:& cmm/assets-context-menu
{:on-close on-close-menu
:state @menu-state
:options [{:option-name "show info"
:id "assets-rename-typography"
:option-handler handle-edit-typography-clicked}]}])]]]))
[:& cmm/assets-context-menu
{:on-close on-close-menu
:state @menu-state
:options [{:option-name "show info"
:id "assets-rename-typography"
:option-handler handle-edit-typography-clicked}]}])]]]))

34
frontend/src/app/main/ui/workspace/sidebar/history.cljs
View file

@ -260,27 +260,27 @@
(let [{entries :items} (mf/deref workspace-undo)
objects (mf/deref refs/workspace-page-objects)]
[:div {:class (stl/css :history-entry-detail)}
(case (:operation entry)
:new
(:name (get-object (:detail entry) entries objects))
[:div {:class (stl/css :history-entry-detail)}
(case (:operation entry)
:new
(:name (get-object (:detail entry) entries objects))
:delete
[:ul {:class (stl/css :history-entry-details-list)}
(for [id (:detail entry)]
(let [shape-name (:name (get-object id entries objects))]
[:li {:key id} shape-name]))]
:delete
[:ul {:class (stl/css :history-entry-details-list)}
(for [id (:detail entry)]
(let [shape-name (:name (get-object id entries objects))]
[:li {:key id} shape-name]))]
:modify
[:ul {:class (stl/css :history-entry-details-list)}
(for [[id attributes] (:detail entry)]
(let [shape-name (:name (get-object id entries objects))]
[:li {:key id}
[:div shape-name]
[:div (str/join ", " attributes)]]))]
:modify
[:ul {:class (stl/css :history-entry-details-list)}
(for [[id attributes] (:detail entry)]
(let [shape-name (:name (get-object id entries objects))]
[:li {:key id}
[:div shape-name]
[:div (str/join ", " attributes)]]))]
nil)]))
nil)]))
(mf/defc history-entry [{:keys [locale entry idx-entry disabled? current?]}]
(let [hover? (mf/use-state false)

144
frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs
View file

@ -317,78 +317,78 @@
(fn [style]
(swap! filters* assoc :listing-thumbs? (= style "grid"))))]
[:div {:class (stl/css :component-swap)}
[:div {:class (stl/css :element-set-title)}
[:span (tr "workspace.options.component.swap")]]
[:div {:class (stl/css :component-swap-content)}
[:div {:class (stl/css :search-field)}
[:& search-bar {:on-change on-search-term-change
:clear-action on-search-clear-click
:value (:term filters)
:placeholder (str (tr "labels.search") " " (get-in libraries [current-library-id :name]))
:icon (mf/html [:span {:class (stl/css :search-icon)} i/search-refactor])}]]
[:div {:class (stl/css :component-swap)}
[:div {:class (stl/css :element-set-title)}
[:span (tr "workspace.options.component.swap")]]
[:div {:class (stl/css :component-swap-content)}
[:div {:class (stl/css :search-field)}
[:& search-bar {:on-change on-search-term-change
:clear-action on-search-clear-click
:value (:term filters)
:placeholder (str (tr "labels.search") " " (get-in libraries [current-library-id :name]))
:icon (mf/html [:span {:class (stl/css :search-icon)} i/search-refactor])}]]
[:div {:class (stl/css :select-field)}
[:& select
{:class (stl/css :select-library)
:default-value current-library-id
:options libraries-options
:on-change on-library-change}]]
[:div {:class (stl/css :select-field)}
[:& select
{:class (stl/css :select-library)
:default-value current-library-id
:options libraries-options
:on-change on-library-change}]]
[:div {:class (stl/css :library-name)} current-library-name]
[:div {:class (stl/css :library-name)} current-library-name]
[:div {:class (stl/css :listing-options-wrapper)}
[:& radio-buttons {:class (stl/css :listing-options)
:selected (if (:listing-thumbs? filters) "grid" "list")
:on-change toggle-list-style
:name "swap-listing-style"}
[:& radio-button {:icon i/view-as-list-refactor
:icon-class (stl/css :radio-button)
:value "list"
:id "swap-opt-list"}]
[:& radio-button {:icon i/flex-grid-refactor
:icon-class (stl/css :radio-button)
:value "grid"
:id "swap-opt-grid"}]]]
[:div {:class (stl/css :listing-options-wrapper)}
[:& radio-buttons {:class (stl/css :listing-options)
:selected (if (:listing-thumbs? filters) "grid" "list")
:on-change toggle-list-style
:name "swap-listing-style"}
[:& radio-button {:icon i/view-as-list-refactor
:icon-class (stl/css :radio-button)
:value "list"
:id "swap-opt-list"}]
[:& radio-button {:icon i/flex-grid-refactor
:icon-class (stl/css :radio-button)
:value "grid"
:id "swap-opt-grid"}]]]
(if (or is-search? (str/empty? (:path filters)))
[:div {:class (stl/css :component-path-empty)}]
[:button {:class (stl/css :component-path)
:on-click on-go-back
:title (:path filters)}
[:span i/arrow-slide]
[:span (:path filters)]])
(if (or is-search? (str/empty? (:path filters)))
[:div {:class (stl/css :component-path-empty)}]
[:button {:class (stl/css :component-path)
:on-click on-go-back
:title (:path filters)}
[:span i/arrow-slide]
[:span (:path filters)]])
(when (empty? items)
[:div {:class (stl/css :component-list-empty)}
(tr "workspace.options.component.swap.empty")])
(when (empty? items)
[:div {:class (stl/css :component-list-empty)}
(tr "workspace.options.component.swap.empty")])
(when (:listing-thumbs? filters)
[:div {:class (stl/css :component-list)}
(for [item groups]
[:& component-group-item {:item item :on-enter-group on-enter-group}])])
(when (:listing-thumbs? filters)
[:div {:class (stl/css :component-list)}
(for [item groups]
[:& component-group-item {:item item :on-enter-group on-enter-group}])])
[:div {:class (stl/css-case :component-grid (:listing-thumbs? filters)
:component-list (not (:listing-thumbs? filters)))}
(for [item items]
(if (:id item)
(let [data (get-in libraries [current-library-id :data])
container (ctf/get-component-page data item)
root-shape (ctf/get-component-root data item)
loop? (or (contains? parent-components (:main-instance-id item))
(contains? parent-components (:id item)))]
[:& component-swap-item {:key (:id item)
:item item
:loop loop?
:shapes shapes
:file-id current-library-id
:root-shape root-shape
:container container
:component-id current-comp-id
:is-search is-search?
:listing-thumbs (:listing-thumbs? filters)}])
[:& component-group-item {:item item :on-enter-group on-enter-group}]))]]]))
[:div {:class (stl/css-case :component-grid (:listing-thumbs? filters)
:component-list (not (:listing-thumbs? filters)))}
(for [item items]
(if (:id item)
(let [data (get-in libraries [current-library-id :data])
container (ctf/get-component-page data item)
root-shape (ctf/get-component-root data item)
loop? (or (contains? parent-components (:main-instance-id item))
(contains? parent-components (:id item)))]
[:& component-swap-item {:key (:id item)
:item item
:loop loop?
:shapes shapes
:file-id current-library-id
:root-shape root-shape
:container container
:component-id current-comp-id
:is-search is-search?
:listing-thumbs (:listing-thumbs? filters)}])
[:& component-group-item {:item item :on-enter-group on-enter-group}]))]]]))
(mf/defc component-ctx-menu
[{:keys [menu-entries on-close show] :as props}]
@ -397,14 +397,14 @@
(dom/stop-propagation event)
(action)
(on-close))]
[:& dropdown {:show show :on-close on-close}
[:ul {:class (stl/css :custom-select-dropdown)}
(for [entry menu-entries :when (not (nil? entry))]
[:li {:key (uuid/next)
:class (stl/css :dropdown-element)
:on-click (partial do-action (:action entry))}
[:span {:class (stl/css :dropdown-label)}
(tr (:msg entry))]])]]))
[:& dropdown {:show show :on-close on-close}
[:ul {:class (stl/css :custom-select-dropdown)}
(for [entry menu-entries :when (not (nil? entry))]
[:li {:key (uuid/next)
:class (stl/css :dropdown-element)
:on-click (partial do-action (:action entry))}
[:span {:class (stl/css :dropdown-label)}
(tr (:msg entry))]])]]))
(mf/defc component-menu
[{:keys [shapes swap-opened?] :as props}]

2
frontend/src/app/main/ui/workspace/sidebar/options/menus/fill.cljs
View file

@ -74,7 +74,7 @@
(st/emit! (dc/add-fill ids {:color default-color
:opacity 1}))
(when (not (some? (seq fills))) (open-content))))
(when (not (some? (seq fills))) (open-content))))
on-change
(mf/use-fn

38
frontend/src/app/main/ui/workspace/sidebar/options/menus/grid_cell.cljs
View file

@ -46,28 +46,28 @@
(set-alignment (-> value keyword))))]
[:div {:class (stl/css :self-align-menu)}
[:& radio-buttons {:selected (d/name alignment)
:on-change handle-set-alignment
:name (dm/str "flex-align-items-" type)}
[:& radio-button {:value "start"
:icon (if is-col? i/align-self-row-left-refactor i/align-self-column-top-refactor)
:title "Align self start"
:id (dm/str "align-self-start-" type)}]
[:& radio-buttons {:selected (d/name alignment)
:on-change handle-set-alignment
:name (dm/str "flex-align-items-" type)}
[:& radio-button {:value "start"
:icon (if is-col? i/align-self-row-left-refactor i/align-self-column-top-refactor)
:title "Align self start"
:id (dm/str "align-self-start-" type)}]
[:& radio-button {:value "center"
:icon (if is-col? i/align-self-row-center-refactor i/align-self-column-center-refactor)
:title "Align self center"
:id (dm/str "align-self-center-" type)}]
[:& radio-button {:value "center"
:icon (if is-col? i/align-self-row-center-refactor i/align-self-column-center-refactor)
:title "Align self center"
:id (dm/str "align-self-center-" type)}]
[:& radio-button {:value "end"
:icon (if is-col? i/align-self-row-right-refactor i/align-self-column-bottom-refactor)
:title "Align self end"
:id (dm/str "align-self-end-" type)}]
[:& radio-button {:value "end"
:icon (if is-col? i/align-self-row-right-refactor i/align-self-column-bottom-refactor)
:title "Align self end"
:id (dm/str "align-self-end-" type)}]
[:& radio-button {:value "stretch"
:icon (if is-col? i/align-self-row-strech i/align-self-column-strech)
:title "Align self stretch"
:id (dm/str "align-self-stretch-" type)}]]]))
[:& radio-button {:value "stretch"
:icon (if is-col? i/align-self-row-strech i/align-self-column-strech)
:title "Align self stretch"
:id (dm/str "align-self-stretch-" type)}]]]))
(mf/defc options

Some files were not shown because too many files have changed in this diff Show more