mirror of
https://github.com/penpot/penpot.git
synced 2025-06-25 06:07:00 +02:00
Merge remote-tracking branch 'origin/staging' into develop
This commit is contained in:
Alejandro Alonso
commit
69f2e7c43f
17 changed files with 215 additions and 120 deletions
|
|
@ -279,8 +279,9 @@
|
|||
(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-index])
|
||||
comments (filter #(some? (get pages (:page-id %))) comments)
|
||||
(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)))]
|
||||
|
|
|
|||
28
frontend/src/app/main/data/workspace/assets.cljs
Normal file
28
frontend/src/app/main/data/workspace/assets.cljs
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
;; This Source Code Form is subject to the terms of the Mozilla Public
|
||||
;; License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
;;
|
||||
;; Copyright (c) KALEIDOS INC
|
||||
|
||||
(ns app.main.data.workspace.assets
|
||||
"Workspace assets management events and helpers."
|
||||
(:require
|
||||
[app.util.storage :refer [storage]]))
|
||||
|
||||
(defn get-current-assets-ordering
|
||||
[]
|
||||
(let [ordering (::ordering @storage)]
|
||||
(or ordering :asc)))
|
||||
|
||||
(defn set-current-assets-ordering!
|
||||
[ordering]
|
||||
(swap! storage assoc ::ordering ordering))
|
||||
|
||||
(defn get-current-assets-list-style
|
||||
[]
|
||||
(let [list-style (::list-style @storage)]
|
||||
(or list-style :thumbs)))
|
||||
|
||||
(defn set-current-assets-list-style!
|
||||
[list-style]
|
||||
(swap! storage assoc ::list-style list-style))
|
||||
|
|
@ -22,6 +22,7 @@
|
|||
[app.main.data.workspace.texts :as dwt]
|
||||
[app.main.data.workspace.undo :as dwu]
|
||||
[app.util.color :as uc]
|
||||
[app.util.storage :refer [storage]]
|
||||
[beicon.core :as rx]
|
||||
[potok.core :as ptk]))
|
||||
|
||||
|
|
@ -647,3 +648,12 @@
|
|||
:position :right})
|
||||
(ptk/event ::ev/event {::ev/name "add-asset-to-library"
|
||||
:asset-type "color"}))))))
|
||||
|
||||
(defn get-active-color-tab
|
||||
[]
|
||||
(let [tab (::tab @storage)]
|
||||
(or tab :ramp)))
|
||||
|
||||
(defn set-active-color-tab!
|
||||
[tab]
|
||||
(swap! storage assoc ::tab tab))
|
||||
|
|
|
|||
|
|
@ -121,7 +121,9 @@
|
|||
(ptk/reify ::select-shape
|
||||
ptk/UpdateEvent
|
||||
(update [_ state]
|
||||
(update-in state [:workspace-local :selected] d/toggle-selection id toggle?))
|
||||
(-> state
|
||||
(update-in [:workspace-local :selected] d/toggle-selection id toggle?)
|
||||
(assoc-in [:workspace-local :last-selected] id)))
|
||||
|
||||
ptk/WatchEvent
|
||||
(watch [_ state _]
|
||||
|
|
@ -184,7 +186,9 @@
|
|||
(ptk/reify ::deselect-shape
|
||||
ptk/UpdateEvent
|
||||
(update [_ state]
|
||||
(update-in state [:workspace-local :selected] disj id))))
|
||||
(-> state
|
||||
(update-in [:workspace-local :selected] disj id)
|
||||
(update :workspace-local dissoc :last-selected)))))
|
||||
|
||||
(defn shift-select-shapes
|
||||
([id]
|
||||
|
|
@ -194,13 +198,15 @@
|
|||
(ptk/reify ::shift-select-shapes
|
||||
ptk/UpdateEvent
|
||||
(update [_ state]
|
||||
(let [objects (or objects (wsh/lookup-page-objects state))
|
||||
(let [objects (or objects (wsh/lookup-page-objects state))
|
||||
append-to-selection (cph/expand-region-selection objects (into #{} [(get-in state [:workspace-local :last-selected]) id]))
|
||||
selection (-> state
|
||||
wsh/lookup-selected
|
||||
(conj id))]
|
||||
(-> state
|
||||
(assoc-in [:workspace-local :selected]
|
||||
(cph/expand-region-selection objects selection))))))))
|
||||
(set/union selection append-to-selection))
|
||||
(update :workspace-local assoc :last-selected id)))))))
|
||||
|
||||
(defn select-shapes
|
||||
[ids]
|
||||
|
|
|
|||
|
|
@ -8,8 +8,10 @@
|
|||
(:require-macros [app.main.style :refer [css]])
|
||||
(:require
|
||||
[app.common.data.macros :as dm]
|
||||
[app.main.data.messages :as msg]
|
||||
[app.main.data.modal :as modal]
|
||||
[app.main.data.workspace :as dw]
|
||||
[app.main.data.workspace.colors :as dc]
|
||||
[app.main.data.workspace.persistence :as dwp]
|
||||
[app.main.features :as features]
|
||||
[app.main.refs :as refs]
|
||||
|
|
@ -192,6 +194,9 @@
|
|||
(st/emit! (dw/initialize-file project-id file-id))
|
||||
(fn []
|
||||
(st/emit! ::dwp/force-persist
|
||||
(dc/stop-picker)
|
||||
(modal/hide)
|
||||
msg/hide
|
||||
(dw/finalize-file project-id file-id))))
|
||||
|
||||
[:& (mf/provider ctx/current-file-id) {:value file-id}
|
||||
|
|
|
|||
|
|
@ -56,12 +56,17 @@
|
|||
|
||||
current-color (:current-color state)
|
||||
|
||||
active-tab (mf/use-state :ramp #_:harmony #_:hsva)
|
||||
set-ramp-tab! (mf/use-fn #(reset! active-tab :ramp))
|
||||
set-harmony-tab! (mf/use-fn #(reset! active-tab :harmony))
|
||||
set-hsva-tab! (mf/use-fn #(reset! active-tab :hsva))
|
||||
|
||||
active-tab (mf/use-state (dc/get-active-color-tab))
|
||||
drag? (mf/use-state false)
|
||||
|
||||
set-tab!
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(let [tab (-> (dom/get-current-target event)
|
||||
(dom/get-data "tab")
|
||||
(keyword))]
|
||||
(reset! active-tab tab)
|
||||
(dc/set-active-color-tab! tab))))
|
||||
|
||||
handle-change-color
|
||||
(mf/use-fn
|
||||
|
|
@ -81,9 +86,9 @@
|
|||
(fn []
|
||||
(if picking-color?
|
||||
(do (modal/disallow-click-outside!)
|
||||
(st/emit! (dc/stop-picker)))
|
||||
(st/emit! (dc/stop-picker)))
|
||||
(do (modal/allow-click-outside!)
|
||||
(st/emit! (dc/start-picker))))))
|
||||
(st/emit! (dc/start-picker))))))
|
||||
|
||||
handle-change-stop
|
||||
(mf/use-fn
|
||||
|
|
@ -225,15 +230,18 @@
|
|||
[:div.colorpicker-tab.tooltip.tooltip-bottom.tooltip-expand
|
||||
{:class (when (= @active-tab :ramp) "active")
|
||||
:alt (tr "workspace.libraries.colors.rgba")
|
||||
:on-click set-ramp-tab!} i/picker-ramp]
|
||||
:on-click set-tab!
|
||||
:data-tab "ramp"} i/picker-ramp]
|
||||
[:div.colorpicker-tab.tooltip.tooltip-bottom.tooltip-expand
|
||||
{:class (when (= @active-tab :harmony) "active")
|
||||
:alt (tr "workspace.libraries.colors.rgb-complementary")
|
||||
:on-click set-harmony-tab!} i/picker-harmony]
|
||||
:on-click set-tab!
|
||||
:data-tab "harmony"} i/picker-harmony]
|
||||
[:div.colorpicker-tab.tooltip.tooltip-bottom.tooltip-expand
|
||||
{:class (when (= @active-tab :hsva) "active")
|
||||
:alt (tr "workspace.libraries.colors.hsv")
|
||||
:on-click set-hsva-tab!} i/picker-hsv]]
|
||||
:on-click set-tab!
|
||||
:data-tab "hsva"} i/picker-hsv]]
|
||||
|
||||
(if picking-color?
|
||||
[:div.picker-detail-wrapper
|
||||
|
|
|
|||
|
|
@ -13,7 +13,6 @@
|
|||
[app.main.data.exports :as de]
|
||||
[app.main.data.modal :as modal]
|
||||
[app.main.data.workspace :as dw]
|
||||
[app.main.data.workspace.colors :as dc]
|
||||
[app.main.data.workspace.common :as dwc]
|
||||
[app.main.data.workspace.libraries :as dwl]
|
||||
[app.main.data.workspace.shortcuts :as sc]
|
||||
|
|
@ -168,9 +167,7 @@
|
|||
(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}))))))
|
||||
|
||||
]
|
||||
(st/emit! (modal/show {:type :release-notes :version version}))))))]
|
||||
|
||||
[:& dropdown {:show true :on-close on-close}
|
||||
[:ul.sub-menu.help-info
|
||||
|
|
@ -603,16 +600,10 @@
|
|||
(dom/prevent-default event)
|
||||
(reset! editing* true)))
|
||||
|
||||
close-modals
|
||||
(mf/use-fn
|
||||
#(st/emit! (dc/stop-picker)
|
||||
(modal/hide)))
|
||||
|
||||
go-back
|
||||
(mf/use-fn
|
||||
(mf/deps project)
|
||||
(fn []
|
||||
(close-modals)
|
||||
(st/emit! (dw/go-to-dashboard project))))
|
||||
|
||||
nav-to-viewer
|
||||
|
|
|
|||
|
|
@ -26,6 +26,7 @@
|
|||
[app.util.object :as obj]
|
||||
[app.util.text-editor :as ted]
|
||||
[app.util.text-svg-position :as tsp]
|
||||
[app.util.timers :as ts]
|
||||
[promesa.core :as p]
|
||||
[rumext.v2 :as mf]))
|
||||
|
||||
|
|
@ -79,25 +80,29 @@
|
|||
|
||||
(defn- update-text-modifier
|
||||
[{:keys [grow-type id] :as shape} node]
|
||||
(->> (tsp/calc-position-data id)
|
||||
(p/fmap (fn [position-data]
|
||||
(let [props {:position-data position-data}]
|
||||
(if (contains? #{:auto-height :auto-width} grow-type)
|
||||
(let [{:keys [width height]} (-> (dom/query node ".paragraph-set") (dom/get-client-size))
|
||||
width (mth/ceil width)
|
||||
height (mth/ceil height)]
|
||||
(if (and (not (mth/almost-zero? width)) (not (mth/almost-zero? height)))
|
||||
(cond-> props
|
||||
(= grow-type :auto-width)
|
||||
(assoc :width width)
|
||||
|
||||
(p/let [position-data (tsp/calc-position-data id)
|
||||
props {:position-data position-data}
|
||||
|
||||
props
|
||||
(if (contains? #{:auto-height :auto-width} grow-type)
|
||||
(let [{:keys [width height]} (-> (dom/query node ".paragraph-set") (dom/get-client-size))
|
||||
width (mth/ceil width)
|
||||
height (mth/ceil height)]
|
||||
(if (and (not (mth/almost-zero? width)) (not (mth/almost-zero? height)))
|
||||
(cond-> props
|
||||
(= grow-type :auto-width)
|
||||
(assoc :width width)
|
||||
|
||||
(or (= grow-type :auto-height) (= grow-type :auto-width))
|
||||
(assoc :height height))
|
||||
props))
|
||||
props)]
|
||||
(st/emit! (dwt/update-text-modifier id props))))
|
||||
(or (= grow-type :auto-height) (= grow-type :auto-width))
|
||||
(assoc :height height))
|
||||
props))
|
||||
props))))
|
||||
(p/fmap (fn [props]
|
||||
;; We need to wait for the text modifier to be updated before
|
||||
;; we can update the position data. Otherwise the position data
|
||||
;; will be wrong.
|
||||
;; TODO: This is a hack. We need to find a better way to do this.
|
||||
(st/emit! (dwt/update-text-modifier id props))
|
||||
(ts/schedule 30 #(update-text-shape shape node))))))
|
||||
|
||||
(mf/defc text-container
|
||||
{::mf/wrap-props false
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@
|
|||
(:require
|
||||
[app.common.data.macros :as dm]
|
||||
[app.main.data.modal :as modal]
|
||||
[app.main.data.workspace.assets :as dwa]
|
||||
[app.main.refs :as refs]
|
||||
[app.main.ui.components.context-menu-a11y :refer [context-menu-a11y]]
|
||||
[app.main.ui.components.search-bar :refer [search-bar]]
|
||||
|
|
@ -68,27 +69,39 @@
|
|||
{::mf/wrap [mf/memo]
|
||||
::mf/wrap-props false}
|
||||
[]
|
||||
(let [components-v2 (mf/use-ctx ctx/components-v2)
|
||||
read-only? (mf/use-ctx ctx/workspace-read-only?)
|
||||
new-css-system (mf/use-ctx ctx/new-css-system)
|
||||
filters* (mf/use-state
|
||||
(let [components-v2 (mf/use-ctx ctx/components-v2)
|
||||
read-only? (mf/use-ctx ctx/workspace-read-only?)
|
||||
new-css-system (mf/use-ctx ctx/new-css-system)
|
||||
filters* (mf/use-state
|
||||
{:term ""
|
||||
:section "all"
|
||||
:ordering :asc
|
||||
:list-style :thumbs
|
||||
:ordering (dwa/get-current-assets-ordering)
|
||||
:list-style (dwa/get-current-assets-list-style)
|
||||
:open-menu false})
|
||||
filters (deref filters*)
|
||||
term (:term filters)
|
||||
menu-open? (:open-menu filters)
|
||||
section (:section filters)
|
||||
ordering (:ordering filters)
|
||||
reverse-sort? (= :desc ordering)
|
||||
filters (deref filters*)
|
||||
term (:term filters)
|
||||
ordering (:ordering filters)
|
||||
list-style (:list-style filters)
|
||||
menu-open? (:open-menu filters)
|
||||
section (:section filters)
|
||||
ordering (:ordering filters)
|
||||
reverse-sort? (= :desc ordering)
|
||||
|
||||
toggle-ordering
|
||||
(mf/use-fn #(swap! filters* update :ordering toggle-values [:asc :desc]))
|
||||
(mf/use-fn
|
||||
(mf/deps ordering)
|
||||
(fn []
|
||||
(let [new-value (toggle-values ordering [:asc :desc])]
|
||||
(swap! filters* assoc :ordering new-value)
|
||||
(dwa/set-current-assets-ordering! new-value))))
|
||||
|
||||
toggle-list-style
|
||||
(mf/use-fn #(swap! filters* update :list-style toggle-values [:thumbs :list]))
|
||||
(mf/use-fn
|
||||
(mf/deps list-style)
|
||||
(fn []
|
||||
(let [new-value (toggle-values list-style [:thumbs :list])]
|
||||
(swap! filters* assoc :list-style new-value)
|
||||
(dwa/set-current-assets-list-style! new-value))))
|
||||
|
||||
on-search-term-change
|
||||
(mf/use-fn
|
||||
|
|
|
|||
|
|
@ -368,10 +368,16 @@
|
|||
|
||||
[:div.element-actions {:class (when ^boolean has-shapes? "is-parent")}
|
||||
[:div.toggle-element {:class (when ^boolean hidden? "selected")
|
||||
:title (if (:hidden item)
|
||||
(tr "workspace.shape.menu.show")
|
||||
(tr "workspace.shape.menu.hide"))
|
||||
:on-click toggle-visibility}
|
||||
(if ^boolean hidden? i/eye-closed i/eye)]
|
||||
[:div.block-element {:class (when ^boolean blocked? "selected")
|
||||
:on-click toggle-blocking}
|
||||
:on-click toggle-blocking
|
||||
:title (if (:blocked item)
|
||||
(tr "workspace.shape.menu.unlock")
|
||||
(tr "workspace.shape.menu.lock"))}
|
||||
(if ^boolean blocked? i/lock i/unlock)]]
|
||||
|
||||
(when ^boolean has-shapes?
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue