diff --git a/CHANGES.md b/CHANGES.md
index 790bed6918..48f4a57f39 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -1,5 +1,49 @@
# CHANGELOG
+## 2.7.0 (Unreleased)
+
+### :rocket: Epics and highlights
+
+### :boom: Breaking changes & Deprecations
+
+### :heart: Community contributions (Thank you!)
+- Design improvements to the Invitations page with an empty state [GitHub #2608](https://github.com/penpot/penpot/issues/2608) by [@iprithvitharun](https://github.com/iprithvitharun)
+
+### :sparkles: New features
+- Update board presets with a newer devices [Taiga #10610](https://tree.taiga.io/project/penpot/us/10610)
+- Propagate "sharing a prototype" to editors and viewers [Taiga #8853](https://tree.taiga.io/project/penpot/us/8853)
+- Design improvements to the Invitations page with an empty state [Taiga #4554](https://tree.taiga.io/project/penpot/us/4554)
+- Duplicate token sets [Taiga #10694](https://tree.taiga.io/project/penpot/issue/10694)
+- Add set selection in create Token themes flow [Taiga #10746](https://tree.taiga.io/project/penpot/issue/10746)
+- Display indicator on not active sets [Taiga #10668](https://tree.taiga.io/project/penpot/issue/10668)
+
+### :bug: Bugs fixed
+- Fix problem in viewer with the back button [Taiga #10907](https://tree.taiga.io/project/penpot/issue/10907)
+- Fix resize bar background on tokens panel [Taiga #10811](https://tree.taiga.io/project/penpot/issue/10811)
+- Fix shortcut for history version panel [Taiga #11006](https://tree.taiga.io/project/penpot/issue/11006)
+- Fix positioning of comment drafts when near the right / bottom edges of viewport [Taiga #10534](https://tree.taiga.io/project/penpot/issue/10534)
+- Fix path having a wrong selrect [Taiga #10257](https://tree.taiga.io/project/penpot/issue/10257)
+- Fix SVG `stroke-linecap` property when importing SVGs [Taiga #9489](https://tree.taiga.io/project/penpot/issue/9489)
+- Fix position problems cutting-pasting a component [Taiga #10677](https://tree.taiga.io/project/penpot/issue/10677)
+- Fix design tab has a horizontal scroll [Taiga #10660](https://tree.taiga.io/project/penpot/issue/10660)
+- Fix long file names being clipped when longer than allowed length [Taiga #10662](https://tree.taiga.io/project/penpot/issue/10662)
+- Fix problem with error detail in toast [Taiga #10519](https://tree.taiga.io/project/penpot/issue/10519)
+- Fix view mode error when an external user tries to export something from a prototype using a shared link [Taiga #10251](https://tree.taiga.io/project/penpot/issue/10251)
+- Fix merge path nodes with only one node selected [Taiga #9626](https://tree.taiga.io/project/penpot/issue/9626)
+- Fix problem with import errors [Taiga #10040](https://tree.taiga.io/project/penpot/issue/10040)
+- Fix color gradient on texts [Taiga Issue #7488](https://tree.taiga.io/project/penpot/issue/7488)
+- Add support for self mentions [Taiga #10809](https://tree.taiga.io/project/penpot/issue/10809)
+- Fix team info settings alignment [Taiga #10869](https://tree.taiga.io/project/penpot/issue/10869)
+- Fix left sidebar horizontal scroll on nested layers [Taiga #10791](https://tree.taiga.io/project/penpot/issue/10791)
+- Improve error message details importing tokens [Taiga Issue #10772](https://tree.taiga.io/project/penpot/issue/10772)
+- Fix no selected set after Drag & Drop [Github #71](https://github.com/tokens-studio/penpot/issues/71)
+- Styledictionary v5 Update [Github #6283](https://github.com/penpot/penpot/pull/6283)
+- Fix Rename a set throws an internal error [Github #78](https://github.com/tokens-studio/penpot/issues/78)
+- Fix Out of Sync Token Value & Color Picker [Github #102](https://github.com/tokens-studio/penpot/issues/102)
+- Fix Color should preserve color space [Github #69](https://github.com/tokens-studio/penpot/issues/69)
+- Fix cannot rename Design Token Sets when group of same name exists [Taiga Issue #10773](https://tree.taiga.io/project/penpot/issue/10773)
+- Fix problem when duplicating grid layout [Github #6391](https://github.com/penpot/penpot/issues/6391)
+
## 2.6.2
### :bug: Bugs fixed
diff --git a/README.md b/README.md
index 77a6a70541..148e31e827 100644
--- a/README.md
+++ b/README.md
@@ -16,18 +16,18 @@
- Website Getting Started User Guide Tutorials & Info Website User Guide Learning Center Community
- Youtube Peertube Linkedin Instagram Mastodon Youtube Peertube Linkedin Instagram Mastodon Bluesky X
@@ -40,12 +40,13 @@
Penpot is the first **open-source** design tool for design and code collaboration. Designers can create stunning designs, interactive prototypes, design systems at scale, while developers enjoy ready-to-use code and make their workflow easy and fast. And all of this with no handoff drama.
-Penpot is available on browser and [self host](https://penpot.app/self-host). It’s web-based and works with open standards (SVG, CSS and HTML). And last but not least, it’s free!
+Available on browser or self-hosted, Penpot works with open standards like SVG, CSS, HTML and JSON, and it’s free!
-Penpot’s latest [huge release 2.0](https://penpot.app/dev-diaries), takes the platform to a whole new level. This update introduces the ground-breaking [CSS Grid Layout feature](https://penpot.app/penpot-2.0), a complete UI redesign, a new Components system, and much more. Plus, it's faster and more accessible.
+The latest updates take Penpot even further. It’s the first design tool to integrate native [design tokens](https://penpot.dev/collaboration/design-tokens)—a single source of truth to improve efficiency and collaboration between product design and development.
+With the [huge 2.0 release](https://penpot.app/dev-diaries), Penpot took the platform to a whole new level. This update introduces the ground-breaking [CSS Grid Layout feature](https://penpot.app/penpot-2.0), a complete UI redesign, a new Components system, and much more.
+For organizations that need extra service for its teams, [get in touch](https://cal.com/team/penpot/talk-to-us)
-
-🎇 **Penpot Fest** is our design, code & Open Source event. Check out the highlights from [Penpot Fest 2023 edition](https://www.youtube.com/watch?v=sOpLZaK5mDc)!
+🎇 Design, code, and Open Source meet at [Penpot Fest](https://penpot.app/penpotfest)! Be part of the 2025 edition in Madrid, Spain, on October 9-10.
## Table of contents ##
@@ -61,7 +62,7 @@ Penpot’s latest [huge release 2.0](https://penpot.app/dev-diaries), takes the
Penpot expresses designs as code. Designers can do their best work and see it will be beautifully implemented by developers in a two-way collaboration.
### Plugin system ###
-[Penpot plugins](https://penpot.app/penpothub/plugins) let you expand the platform's capabilities, give you the flexibility to integrate it with other apps, and design custom solutions.
+[Penpot plugins](https://penpot.app/penpothub/plugins) let you expand the platform's capabilities, give you the flexibility to integrate it with other apps, and design custom solutions.
### Designed for developers ###
Penpot was built to serve both designers and developers and create a fluid design-code process. You have the choice to enjoy real-time collaboration or play "solo".
@@ -78,6 +79,10 @@ Penpot offers integration into the development toolchain, thanks to its support
### What’s great for design ###
With Penpot you can design libraries to share and reuse; turn design elements into components and tokens to allow reusability and scalability; and build realistic user flows and interactions.
+### Design Tokens ###
+With Penpot’s standardized [design tokens](https://penpot.dev/collaboration/design-tokens) format, you can easily reuse and sync tokens across different platforms, workflows, and disciplines.
+
+
@@ -125,13 +130,13 @@ You will find the following categories:
## Contributing ##
-Any contribution will make a difference to improve Penpot. How can you get involved?
+Any contribution will make a difference to improve Penpot. How can you get involved?
-Choose your way:
+Choose your way:
- Create and [share Libraries & Templates](https://penpot.app/libraries-templates.html) that will be helpful for the community
- Invite your [team to join](https://design.penpot.app/#/auth/register)
-- Star this repo and follow us on Social Media: [Mastodon](https://fosstodon.org/@penpot/), [Youtube](https://www.youtube.com/c/Penpot), [Instagram](https://instagram.com/penpot.app), [Linkedin](https://www.linkedin.com/company/penpotdesign), [Peertube](https://peertube.kaleidos.net/a/penpot_app) and [X](https://twitter.com/penpotapp).
+- Give this repo a star and follow us on Social Media: [Mastodon](https://fosstodon.org/@penpot/), [Youtube](https://www.youtube.com/c/Penpot), [Instagram](https://instagram.com/penpot.app), [Linkedin](https://www.linkedin.com/company/penpotdesign), [Peertube](https://peertube.kaleidos.net/a/penpot_app), [X](https://twitter.com/penpotapp) and [BlueSky](https://bsky.app/profile/penpot.app)
- Participate in the [Community](https://community.penpot.app/) space by asking and answering questions; reacting to others’ articles; opening your own conversations and following along on decisions affecting the project.
- Report bugs with our easy [guide for bugs hunting](https://help.penpot.app/contributing-guide/reporting-bugs/) or [GitHub issues](https://github.com/penpot/penpot/issues)
- Become a [translator](https://help.penpot.app/contributing-guide/translations)
diff --git a/backend/scripts/repl b/backend/scripts/repl
index 558a68b955..04865d1004 100755
--- a/backend/scripts/repl
+++ b/backend/scripts/repl
@@ -31,7 +31,8 @@ export PENPOT_FLAGS="\
enable-tiered-file-data-storage \
enable-file-validation \
enable-file-schema-validation \
- enable-subscriptions-old";
+ enable-subscriptons \
+ enable-subscriptons-old";
# Default deletion delay for devenv
export PENPOT_DELETION_DELAY="24h"
@@ -71,15 +72,18 @@ export PENPOT_OBJECTS_STORAGE_S3_ENDPOINT=http://minio:9000
export PENPOT_OBJECTS_STORAGE_S3_BUCKET=penpot
export PENPOT_OBJECTS_STORAGE_FS_DIRECTORY="assets"
-export JAVA_OPTS="--enable-preview \
+export JAVA_OPTS="\
-Djava.util.logging.manager=org.apache.logging.log4j.jul.LogManager \
-Djdk.attach.allowAttachSelf \
-Dlog4j2.configurationFile=log4j2-devenv-repl.xml \
-Djdk.tracePinnedThreads=full \
-XX:+EnableDynamicAgentLoading \
- -XX:-OmitStackTraceInFastThrow \
+ -XX:-OmitStackTraceInFastThrow \
-XX:+UnlockDiagnosticVMOptions \
- -XX:+DebugNonSafepoints";
+ -XX:+DebugNonSafepoints \
+ --sun-misc-unsafe-memory-access=allow \
+ --enable-preview \
+ --enable-native-access=ALL-UNNAMED";
export OPTIONS="-A:jmx-remote -A:dev"
diff --git a/backend/scripts/run.template.sh b/backend/scripts/run.template.sh
index e1f7a727b4..46a4e45552 100644
--- a/backend/scripts/run.template.sh
+++ b/backend/scripts/run.template.sh
@@ -18,7 +18,7 @@ if [ -f ./environ ]; then
source ./environ
fi
-export JVM_OPTS="-Djava.util.logging.manager=org.apache.logging.log4j.jul.LogManager -Dlog4j2.configurationFile=log4j2.xml -XX:-OmitStackTraceInFastThrow --enable-preview $JVM_OPTS"
+export JVM_OPTS="-Djava.util.logging.manager=org.apache.logging.log4j.jul.LogManager -Dlog4j2.configurationFile=log4j2.xml -XX:-OmitStackTraceInFastThrow --enable-native-access=ALL-UNNAMED --enable-preview $JVM_OPTS"
ENTRYPOINT=${1:-app.main};
diff --git a/backend/scripts/start-dev b/backend/scripts/start-dev
index dae3af23a7..5f446ef817 100755
--- a/backend/scripts/start-dev
+++ b/backend/scripts/start-dev
@@ -24,18 +24,8 @@ export PENPOT_FLAGS="\
enable-tiered-file-data-storage \
enable-file-validation \
enable-file-schema-validation \
- enable-subscriptions-old";
-
-export OPTIONS="
- -A:jmx-remote -A:dev \
- -J-Djava.util.logging.manager=org.apache.logging.log4j.jul.LogManager \
- -J-Djdk.attach.allowAttachSelf \
- -J-Dpolyglot.engine.WarnInterpreterOnly=false \
- -J-Dlog4j2.configurationFile=log4j2-devenv.xml \
- -J-XX:+EnableDynamicAgentLoading \
- -J-XX:-OmitStackTraceInFastThrow \
- -J-XX:+UnlockDiagnosticVMOptions \
- -J-XX:+DebugNonSafepoints"
+ enable-subscriptons \
+ enable-subscriptons-old ";
# Default deletion delay for devenv
export PENPOT_DELETION_DELAY="24h"
@@ -66,6 +56,20 @@ export PENPOT_OBJECTS_STORAGE_S3_BUCKET=penpot
entrypoint=${1:-app.main};
-set -ex
+export JAVA_OPTS="\
+ -Djava.util.logging.manager=org.apache.logging.log4j.jul.LogManager \
+ -Djdk.attach.allowAttachSelf \
+ -Dlog4j2.configurationFile=log4j2-devenv.xml \
+ -Djdk.tracePinnedThreads=full \
+ -XX:+EnableDynamicAgentLoading \
+ -XX:-OmitStackTraceInFastThrow \
+ -XX:+UnlockDiagnosticVMOptions \
+ -XX:+DebugNonSafepoints \
+ --sun-misc-unsafe-memory-access=allow \
+ --enable-preview \
+ --enable-native-access=ALL-UNNAMED";
-clojure $OPTIONS -A:dev -M -m $entrypoint;
+export OPTIONS="-A:jmx-remote -A:dev"
+
+set -ex
+clojure $OPTIONS -M -m $entrypoint;
diff --git a/backend/src/app/binfile/cleaner.clj b/backend/src/app/binfile/cleaner.clj
index 1f4d29ea1f..558cfa129e 100644
--- a/backend/src/app/binfile/cleaner.clj
+++ b/backend/src/app/binfile/cleaner.clj
@@ -11,6 +11,25 @@
[app.common.data :as d]
[app.common.uuid :as uuid]))
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+;; PRE DECODE
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+
+(defn clean-shape-pre-decode
+ "Applies a pre-decode phase migration to the shape"
+ [shape]
+ (if (= "bool" (:type shape))
+ (if-let [content (get shape :bool-content)]
+ (-> shape
+ (assoc :content content)
+ (dissoc :bool-content))
+ shape)
+ shape))
+
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+;; POST DECODE
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+
(defn- fix-shape-shadow-color
"Some shapes can come with invalid `id` property on shadow colors
caused by incorrect uuid parsing bug that should be already fixed;
diff --git a/backend/src/app/binfile/v3.clj b/backend/src/app/binfile/v3.clj
index 07ba4618dd..c2b46b4159 100644
--- a/backend/src/app/binfile/v3.clj
+++ b/backend/src/app/binfile/v3.clj
@@ -603,10 +603,20 @@
(reduce-kv (fn [objects id shape]
(assoc objects id (bfl/clean-shape-post-decode shape)))
objects
+ objects))))
+ clean-component-pre-decode
+ (fn [component]
+ (d/update-when component :objects
+ (fn [objects]
+ (reduce-kv (fn [objects id shape]
+ (assoc objects id (bfl/clean-shape-pre-decode shape)))
+ objects
objects))))]
+
(->> (keep (match-component-entry-fn file-id) entries)
(reduce (fn [result {:keys [id entry]}]
(let [object (->> (read-entry input entry)
+ (clean-component-pre-decode)
(decode-component)
(clean-component-post-decode)
(validate-component))]
@@ -641,10 +651,10 @@
(->> (keep (match-shape-entry-fn file-id page-id) entries)
(reduce (fn [result {:keys [id entry]}]
(let [object (->> (read-entry input entry)
+ (bfl/clean-shape-pre-decode)
(decode-shape)
(bfl/clean-shape-post-decode)
(validate-shape))]
-
(if (= id (:id object))
(assoc result id object)
result)))
@@ -755,7 +765,6 @@
;; only the applied
(vary-meta dissoc ::fmg/migrated))]
-
(bfm/register-pending-migrations! cfg file)
(bfc/save-file! cfg file ::db/return-keys false)
diff --git a/backend/src/app/features/components_v2.clj b/backend/src/app/features/components_v2.clj
index 025916bb6b..af106b1672 100644
--- a/backend/src/app/features/components_v2.clj
+++ b/backend/src/app/features/components_v2.clj
@@ -1462,8 +1462,6 @@
(:objects page)
(:id page)
file-id
- true
- nil
cfsh/prepare-create-artboard-from-selection)]
(shape-cb shape)
diff --git a/backend/src/app/loggers/audit.clj b/backend/src/app/loggers/audit.clj
index 88e506f225..20d300ea7f 100644
--- a/backend/src/app/loggers/audit.clj
+++ b/backend/src/app/loggers/audit.clj
@@ -108,6 +108,7 @@
[::ip-addr {:optional true} ::sm/text]
[::props {:optional true} [:map-of :keyword :any]]
[::context {:optional true} [:map-of :keyword :any]]
+ [::tracked-at {:optional true} ::sm/inst]
[::webhooks/event? {:optional true} ::sm/boolean]
[::webhooks/batch-timeout {:optional true} ::dt/duration]
[::webhooks/batch-key {:optional true}
@@ -118,12 +119,12 @@
(defn prepare-event
[cfg mdata params result]
- (let [resultm (meta result)
- request (-> params meta ::http/request)
- profile-id (or (::profile-id resultm)
- (:profile-id result)
- (::rpc/profile-id params)
- uuid/zero)
+ (let [resultm (meta result)
+ request (-> params meta ::http/request)
+ profile-id (or (::profile-id resultm)
+ (:profile-id result)
+ (::rpc/profile-id params)
+ uuid/zero)
session-id (get params ::rpc/external-session-id)
event-origin (get params ::rpc/external-event-origin)
@@ -135,14 +136,14 @@
(clean-props))
- token-id (::actoken/id request)
- context (-> (::context resultm)
- (assoc :external-session-id session-id)
- (assoc :external-event-origin event-origin)
- (assoc :access-token-id (some-> token-id str))
- (d/without-nils))
+ token-id (::actoken/id request)
+ context (-> (::context resultm)
+ (assoc :external-session-id session-id)
+ (assoc :external-event-origin event-origin)
+ (assoc :access-token-id (some-> token-id str))
+ (d/without-nils))
- ip-addr (inet/parse-request request)]
+ ip-addr (inet/parse-request request)]
{::type (or (::type resultm)
(::rpc/type cfg))
diff --git a/backend/src/app/loggers/webhooks.clj b/backend/src/app/loggers/webhooks.clj
index 9d2892dd7d..1b8305504d 100644
--- a/backend/src/app/loggers/webhooks.clj
+++ b/backend/src/app/loggers/webhooks.clj
@@ -15,6 +15,7 @@
[app.config :as cf]
[app.db :as db]
[app.http.client :as http]
+ [app.loggers.audit :as audit]
[app.util.time :as dt]
[app.worker :as wrk]
[clojure.data.json :as json]
@@ -67,18 +68,27 @@
(defmethod ig/init-key ::process-event-handler
[_ cfg]
(fn [{:keys [props] :as task}]
- (l/dbg :hint "process webhook event" :name (:name props))
- (when-let [items (lookup-webhooks cfg props)]
- (l/trc :hint "webhooks found for event" :total (count items))
- (db/tx-run! cfg (fn [cfg]
- (doseq [item items]
- (wrk/submit! (-> cfg
- (assoc ::wrk/task :run-webhook)
- (assoc ::wrk/queue :webhooks)
- (assoc ::wrk/max-retries 3)
- (assoc ::wrk/params {:event props
- :config item})))))))))
+ (let [items (lookup-webhooks cfg props)
+ event {::audit/profile-id (:profile-id props)
+ ::audit/name "webhook"
+ ::audit/type "trigger"
+ ::audit/props {:name (get props :name)
+ :event-id (get props :id)
+ :total-affected (count items)}}]
+
+ (audit/insert! cfg event)
+
+ (when items
+ (l/trc :hint "webhooks found for event" :total (count items))
+ (db/tx-run! cfg (fn [cfg]
+ (doseq [item items]
+ (wrk/submit! (-> cfg
+ (assoc ::wrk/task :run-webhook)
+ (assoc ::wrk/queue :webhooks)
+ (assoc ::wrk/max-retries 3)
+ (assoc ::wrk/params {:event props
+ :config item}))))))))))
;; --- RUN
(declare interpret-exception)
diff --git a/backend/src/app/rpc/commands/files.clj b/backend/src/app/rpc/commands/files.clj
index 117a432ab8..bdb2fcbc59 100644
--- a/backend/src/app/rpc/commands/files.clj
+++ b/backend/src/app/rpc/commands/files.clj
@@ -208,7 +208,7 @@
[:project-id {:optional true} ::sm/uuid]])
(defn- migrate-file
- [{:keys [::db/conn] :as cfg} {:keys [id] :as file}]
+ [{:keys [::db/conn] :as cfg} {:keys [id] :as file} {:keys [read-only?]}]
(binding [pmap/*load-fn* (partial feat.fdata/load-pointer cfg id)
pmap/*tracked* (pmap/create-tracked)]
(let [;; For avoid unnecesary overhead of creating multiple pointers and
@@ -219,43 +219,45 @@
file (-> file
(update :data feat.fdata/process-pointers deref)
(update :data feat.fdata/process-objects (partial into {}))
- (fmg/migrate-file))
+ (fmg/migrate-file))]
- ;; When file is migrated, we break the rule of no perform
- ;; mutations on get operations and update the file with all
- ;; migrations applied
- ;;
- ;; WARN: he following code will not work on read-only mode,
- ;; it is a known issue; we keep is not implemented until we
- ;; really need this.
- file (if (contains? (:features file) "fdata/objects-map")
- (feat.fdata/enable-objects-map file)
- file)
- file (if (contains? (:features file) "fdata/pointer-map")
- (feat.fdata/enable-pointer-map file)
- file)]
+ (if (or read-only? (db/read-only? conn))
+ file
+ (let [;; When file is migrated, we break the rule of no perform
+ ;; mutations on get operations and update the file with all
+ ;; migrations applied
+ file (if (contains? (:features file) "fdata/objects-map")
+ (feat.fdata/enable-objects-map file)
+ file)
+ file (if (contains? (:features file) "fdata/pointer-map")
+ (feat.fdata/enable-pointer-map file)
+ file)]
- (db/update! conn :file
- {:data (blob/encode (:data file))
- :version (:version file)
- :features (db/create-array conn "text" (:features file))}
- {:id id})
+ (db/update! conn :file
+ {:data (blob/encode (:data file))
+ :version (:version file)
+ :features (db/create-array conn "text" (:features file))}
+ {:id id}
+ {::db/return-keys false})
- (when (contains? (:features file) "fdata/pointer-map")
- (feat.fdata/persist-pointers! cfg id))
+ (when (contains? (:features file) "fdata/pointer-map")
+ (feat.fdata/persist-pointers! cfg id))
- (feat.fmigr/upsert-migrations! conn file)
- (feat.fmigr/resolve-applied-migrations cfg file))))
+ (feat.fmigr/upsert-migrations! conn file)
+ (feat.fmigr/resolve-applied-migrations cfg file))))))
(defn get-file
[{:keys [::db/conn ::wrk/executor] :as cfg} id
& {:keys [project-id
migrate?
include-deleted?
- lock-for-update?]
+ lock-for-update?
+ preload-pointers?]
:or {include-deleted? false
lock-for-update? false
- migrate? true}}]
+ migrate? true
+ preload-pointers? false}
+ :as options}]
(assert (db/connection? conn) "expected cfg with valid connection")
@@ -273,10 +275,16 @@
;; because it has heavy and synchronous operations for
;; decoding file body that are not very friendly with virtual
;; threads.
- file (px/invoke! executor #(decode-row file))]
+ file (px/invoke! executor #(decode-row file))
+
+ file (if (and migrate? (fmg/need-migration? file))
+ (migrate-file cfg file options)
+ file)]
+
+ (if preload-pointers?
+ (binding [pmap/*load-fn* (partial feat.fdata/load-pointer cfg id)]
+ (update file :data feat.fdata/process-pointers deref))
- (if (and migrate? (fmg/need-migration? file))
- (migrate-file cfg file)
file)))
(defn get-minimal-file
@@ -474,7 +482,7 @@
(update page :objects update-vals #(dissoc % :thumbnail)))
(defn get-page
- [{:keys [::db/conn] :as cfg} {:keys [profile-id file-id page-id object-id] :as params}]
+ [{:keys [::db/conn] :as cfg} {:keys [profile-id file-id page-id object-id share-id] :as params}]
(when (and (uuid? object-id)
(not (uuid? page-id)))
@@ -482,22 +490,30 @@
:code :params-validation
:hint "page-id is required when object-id is provided"))
- (let [team (teams/get-team conn
- :profile-id profile-id
- :file-id file-id)
+ (let [perms (get-permissions conn profile-id file-id share-id)
- file (get-file cfg file-id)
+ file (get-file cfg file-id :read-only? true)
- _ (-> (cfeat/get-team-enabled-features cf/flags team)
- (cfeat/check-client-features! (:features params))
- (cfeat/check-file-features! (:features file)))
+ proj (db/get conn :project {:id (:project-id file)})
- page (binding [pmap/*load-fn* (partial feat.fdata/load-pointer cfg file-id)]
- (let [page-id (or page-id (-> file :data :pages first))
- page (dm/get-in file [:data :pages-index page-id])]
- (if (pmap/pointer-map? page)
- (deref page)
- page)))]
+ team (-> (db/get conn :team {:id (:team-id proj)})
+ (teams/decode-row))
+
+ _ (-> (cfeat/get-team-enabled-features cf/flags team)
+ (cfeat/check-client-features! (:features params))
+ (cfeat/check-file-features! (:features file)))
+
+ page (binding [pmap/*load-fn* (partial feat.fdata/load-pointer cfg file-id)]
+ (let [page-id (or page-id (-> file :data :pages first))
+ page (dm/get-in file [:data :pages-index page-id])]
+ (if (pmap/pointer-map? page)
+ (deref page)
+ page)))]
+
+ (when-not perms
+ (ex/raise :type :not-found
+ :code :object-not-found
+ :hint "object not found"))
(cond-> (prune-thumbnails page)
(some? object-id)
@@ -733,7 +749,9 @@
:project-id project-id
:file-id id)
- file (get-file cfg id :project-id project-id)]
+ file (get-file cfg id
+ :project-id project-id
+ :read-only? true)]
(-> (cfeat/get-team-enabled-features cf/flags team)
(cfeat/check-client-features! (:features params))
diff --git a/backend/src/app/rpc/commands/files_thumbnails.clj b/backend/src/app/rpc/commands/files_thumbnails.clj
index 2455807dd8..9d64ec504d 100644
--- a/backend/src/app/rpc/commands/files_thumbnails.clj
+++ b/backend/src/app/rpc/commands/files_thumbnails.clj
@@ -10,7 +10,6 @@
[app.common.data.macros :as dm]
[app.common.features :as cfeat]
[app.common.files.helpers :as cfh]
- [app.common.files.migrations :as fmg]
[app.common.geom.shapes :as gsh]
[app.common.schema :as sm]
[app.common.thumbnails :as thc]
@@ -18,7 +17,6 @@
[app.config :as cf]
[app.db :as db]
[app.db.sql :as-alias sql]
- [app.features.fdata :as feat.fdata]
[app.loggers.audit :as-alias audit]
[app.loggers.webhooks :as-alias webhooks]
[app.media :as media]
@@ -200,14 +198,13 @@
(db/run! cfg (fn [{:keys [::db/conn] :as cfg}]
(files/check-read-permissions! conn profile-id file-id)
- (let [team (teams/get-team conn
- :profile-id profile-id
- :file-id file-id)
+ (let [team (teams/get-team conn
+ :profile-id profile-id
+ :file-id file-id)
- file (binding [pmap/*load-fn* (partial feat.fdata/load-pointer cfg file-id)]
- (-> (files/get-file cfg file-id :migrate? false)
- (update :data feat.fdata/process-pointers deref)
- (fmg/migrate-file)))]
+ file (files/get-file cfg file-id
+ :preload-pointers? true
+ :read-only? true)]
(-> (cfeat/get-team-enabled-features cf/flags team)
(cfeat/check-file-features! (:features file)))
diff --git a/backend/src/app/srepl/fixes.clj b/backend/src/app/srepl/fixes.clj
index 117030397e..18d849603b 100644
--- a/backend/src/app/srepl/fixes.clj
+++ b/backend/src/app/srepl/fixes.clj
@@ -179,7 +179,7 @@
component-child (first component-children)]
(if (or (nil? child) (nil? component-child))
container
- (let [container (if (and (not (ctk/is-main-of? component-child child true))
+ (let [container (if (and (not (ctk/is-main-of? component-child child))
(nil? (ctk/get-swap-slot child))
(ctk/instance-head? child))
(let [slot (guess-swap-slot component-child component-container)]
diff --git a/common/src/app/common/data/macros.cljc b/common/src/app/common/data/macros.cljc
index f339a73444..e0096b21cc 100644
--- a/common/src/app/common/data/macros.cljc
+++ b/common/src/app/common/data/macros.cljc
@@ -6,7 +6,7 @@
(ns app.common.data.macros
"Data retrieval & manipulation specific macros."
- (:refer-clojure :exclude [get-in select-keys str with-open min max])
+ (:refer-clojure :exclude [get-in select-keys str with-open max])
#?(:cljs (:require-macros [app.common.data.macros]))
(:require
#?(:clj [clojure.core :as c]
@@ -144,3 +144,8 @@
(str "expr assert: " (pr-str expr)))]
(when *assert*
`(runtime-assert ~hint (fn [] ~expr))))))
+
+(defn truncate
+ "Truncates a string to a certain length"
+ [s max-length]
+ (subs s 0 (min max-length (count s))))
diff --git a/common/src/app/common/features.cljc b/common/src/app/common/features.cljc
index a56829ef33..8f53a9257e 100644
--- a/common/src/app/common/features.cljc
+++ b/common/src/app/common/features.cljc
@@ -103,9 +103,7 @@
"Translate a flag to a feature name"
[flag]
(case flag
- :feature-components-v2 "components/v2"
:feature-styles-v2 "styles/v2"
- :feature-grid-layout "layout/grid"
:feature-fdata-objects-map "fdata/objects-map"
:feature-fdata-pointer-map "fdata/pointer-map"
:feature-plugins "plugins/runtime"
@@ -216,6 +214,12 @@
(check-supported-features! file-features)
+ ;; Components v1 is deprecated
+ (when-not (contains? file-features "components/v2")
+ (ex/raise :type :restriction
+ :code :file-in-components-v1
+ :hint "components v1 is deprecated"))
+
(let [not-supported (-> file-features
(set/difference enabled-features)
(set/difference backend-only-features)
diff --git a/common/src/app/common/files/builder.cljc b/common/src/app/common/files/builder.cljc
index 5d93c515f8..d320e8bc43 100644
--- a/common/src/app/common/files/builder.cljc
+++ b/common/src/app/common/files/builder.cljc
@@ -11,7 +11,6 @@
[app.common.exceptions :as ex]
[app.common.files.changes :as ch]
[app.common.geom.point :as gpt]
- [app.common.geom.rect :as grc]
[app.common.geom.shapes :as gsh]
[app.common.pprint :as pp]
[app.common.schema :as sm]
@@ -38,20 +37,12 @@
fail-on-spec?]
:or {add-container? false
fail-on-spec? false}}]
- (let [components-v2 (dm/get-in file [:data :options :components-v2])
- component-id (:current-component-id file)
- change (cond-> change
- (and add-container? (some? component-id) (not components-v2))
- (-> (assoc :component-id component-id)
- (cond-> (some? (:current-frame-id file))
- (assoc :frame-id (:current-frame-id file))))
-
- (and add-container? (or (nil? component-id) components-v2))
+ (let [change (cond-> change
+ add-container?
(assoc :page-id (:current-page-id file)
:frame-id (:current-frame-id file)))
- valid? (or (and components-v2
- (nil? (:component-id change))
+ valid? (or (and (nil? (:component-id change))
(nil? (:page-id change)))
(ch/valid-change? change))]
@@ -66,11 +57,11 @@
(cond-> file
(and valid? (or (not add-container?) (some? (:component-id change)) (some? (:page-id change))))
- (-> (update :changes conjv change) ;; In components-v2 we do not add shapes
- (update :data ch/process-changes [change] false)) ;; inside a component
+ (-> (update :changes conjv change)
+ (update :data ch/process-changes [change] false))
(not valid?)
- (update :errors conjv change)))));)
+ (update :errors conjv change)))))
(defn- lookup-objects
([file]
@@ -185,12 +176,10 @@
(update :parent-stack conjv (:id obj)))))
(defn close-artboard [file]
- (let [components-v2 (dm/get-in file [:data :options :components-v2])
- parent-id (-> file :parent-stack peek)
+ (let [parent-id (-> file :parent-stack peek)
parent (lookup-shape file parent-id)
current-frame-id (or (:frame-id parent)
- (when (or (nil? (:current-component-id file)) components-v2)
- root-id))]
+ root-id)]
(-> file
(assoc :current-frame-id current-frame-id)
(update :parent-stack pop))))
@@ -283,14 +272,14 @@
:else
(let [objects (lookup-objects file)
- bool-content (gsh/calc-bool-content bool objects)
- bool' (gsh/update-bool-selrect bool children objects)]
+ content (gsh/calc-bool-content bool objects)
+ bool' (gsh/update-bool-selrect bool children objects)]
(commit-change
file
{:type :mod-obj
:id bool-id
:operations
- [{:type :set :attr :bool-content :val bool-content :ignore-touched true}
+ [{:type :set :attr :content :val content :ignore-touched true}
{:type :set :attr :selrect :val (:selrect bool') :ignore-touched true}
{:type :set :attr :points :val (:points bool') :ignore-touched true}
{:type :set :attr :x :val (-> bool' :selrect :x) :ignore-touched true}
@@ -514,58 +503,29 @@
(defn start-component
([file data]
- (let [components-v2 (dm/get-in file [:data :options :components-v2])
- root-type (if components-v2 :frame :group)]
- (start-component file data root-type)))
+ (start-component file data :frame))
([file data root-type]
- ;; FIXME: data probably can be a shape instance, then we can use gsh/shape->rect
- (let [components-v2 (dm/get-in file [:data :options :components-v2])
- selrect (or (grc/make-rect (:x data) (:y data) (:width data) (:height data))
- grc/empty-rect)
- name (:name data)
+ (let [name (:name data)
path (:path data)
main-instance-id (:main-instance-id data)
main-instance-page (:main-instance-page data)
- ;; In components v1 we must create the root shape and set it inside
- ;; the :objects attribute of the component. When in components-v2,
- ;; this will be ignored as the root shape has already been created
- ;; in its page, by the normal page import.
- attrs (-> data
- (assoc :type root-type)
- (assoc :x (:x selrect))
- (assoc :y (:y selrect))
- (assoc :width (:width selrect))
- (assoc :height (:height selrect))
- (assoc :selrect selrect)
- (dissoc :path)
- (dissoc :main-instance-id)
- (dissoc :main-instance-page)
- (dissoc :main-instance-x)
- (dissoc :main-instance-y))
-
- obj (-> (cts/setup-shape attrs)
- (check-name file root-type)
- ;; Components need to have nil values for frame and parent
- (assoc :frame-id nil)
- (assoc :parent-id nil))]
+ obj-id (or (:id data) (uuid/next))]
(-> file
(commit-change
- (cond-> {:type :add-component
- :id (:id obj)
- :name name
- :path path
- :main-instance-id main-instance-id
- :main-instance-page main-instance-page}
- (not components-v2)
- (assoc :shapes [obj])))
+ {:type :add-component
+ :id obj-id
+ :name name
+ :path path
+ :main-instance-id main-instance-id
+ :main-instance-page main-instance-page})
- (assoc :last-id (:id obj))
- (assoc :parent-stack [(:id obj)])
- (assoc :current-component-id (:id obj))
- (assoc :current-frame-id (if (= (:type obj) :frame) (:id obj) uuid/zero))))))
+ (assoc :last-id obj-id)
+ (assoc :parent-stack [obj-id])
+ (assoc :current-component-id obj-id)
+ (assoc :current-frame-id (if (= root-type :frame) obj-id uuid/zero))))))
(defn start-deleted-component
[file data]
@@ -600,8 +560,7 @@
file
(cond
- ;; In components-v2 components haven't any shape inside them.
- (and component-data (:main-instance-id component-data))
+ component-data
(update file :data
(fn [data]
(ctkl/update-component data component-id dissoc :objects)))
@@ -677,17 +636,12 @@
page (ctpl/get-page (:data file) page-id)
component (ctkl/get-component (:data file) component-id)
- components-v2 (dm/get-in file [:options :components-v2])
-
[shape shapes]
(ctn/make-component-instance page
component
(:id file)
(gpt/point x
- y)
- components-v2
- #_{:main-instance true
- :force-id main-instance-id})]
+ y))]
(as-> file $
(reduce #(commit-change %1
diff --git a/common/src/app/common/files/changes.cljc b/common/src/app/common/files/changes.cljc
index 78845e8f4f..023491a9ca 100644
--- a/common/src/app/common/files/changes.cljc
+++ b/common/src/app/common/files/changes.cljc
@@ -26,11 +26,10 @@
[app.common.types.pages-list :as ctpl]
[app.common.types.shape :as cts]
[app.common.types.shape-tree :as ctst]
- [app.common.types.token :as cto]
- [app.common.types.token-theme :as ctot]
[app.common.types.tokens-lib :as ctob]
[app.common.types.typographies-list :as ctyl]
[app.common.types.typography :as ctt]
+ [app.common.types.variant :as ctv]
[app.common.uuid :as uuid]
[clojure.set :as set]))
@@ -336,13 +335,17 @@
[:type [:= :mod-component]]
[:id ::sm/uuid]
[:shapes {:optional true} [:vector {:gen/max 3} :any]]
- [:name {:optional true} :string]]]
+ [:name {:optional true} :string]
+ [:variant-id {:optional true} ::sm/uuid]
+ [:variant-properties {:optional true} [:vector ::ctv/variant-property]]]]
[:del-component
[:map {:title "DelComponentChange"}
[:type [:= :del-component]]
[:id ::sm/uuid]
- [:main-instance {:optional true} :any]
+ ;; when it is an undo of a cut-paste, we need to undo the movement
+ ;; of the shapes so we need to move them delta
+ [:delta {:optional true} ::gpt/point]
[:skip-undelete? {:optional true} :boolean]]]
[:restore-component
@@ -403,7 +406,7 @@
[:type [:= :set-token-theme]]
[:theme-name :string]
[:group :string]
- [:theme [:maybe ::ctot/token-theme]]]]
+ [:theme [:maybe ctob/schema:token-theme-attrs]]]]
[:set-tokens-lib
[:map {:title "SetTokensLib"}
@@ -415,14 +418,14 @@
[:type [:= :set-token-set]]
[:set-name :string]
[:group? :boolean]
- [:token-set [:maybe ::ctot/token-set]]]]
+ [:token-set [:maybe ctob/schema:token-set-attrs]]]]
[:set-token
[:map {:title "SetTokenChange"}
[:type [:= :set-token]]
[:set-name :string]
[:token-name :string]
- [:token [:maybe ::cto/token]]]]]])
+ [:token [:maybe ctob/schema:token-attrs]]]]]])
(def schema:changes
[:sequential {:gen/max 5 :gen/min 1} schema:change])
@@ -956,8 +959,8 @@
(ctkl/mod-component data params))
(defmethod process-change :del-component
- [data {:keys [id skip-undelete? main-instance]}]
- (ctf/delete-component data id skip-undelete? main-instance))
+ [data {:keys [id skip-undelete? delta]}]
+ (ctf/delete-component data id skip-undelete? delta))
(defmethod process-change :restore-component
[data {:keys [id page-id]}]
diff --git a/common/src/app/common/files/changes_builder.cljc b/common/src/app/common/files/changes_builder.cljc
index aa360d2926..692bde840c 100644
--- a/common/src/app/common/files/changes_builder.cljc
+++ b/common/src/app/common/files/changes_builder.cljc
@@ -921,11 +921,11 @@
(apply-changes-local))))
(defn add-component
- ([changes id path name new-shapes updated-shapes main-instance-id main-instance-page]
- (add-component changes id path name new-shapes updated-shapes main-instance-id main-instance-page nil nil nil))
- ([changes id path name new-shapes updated-shapes main-instance-id main-instance-page annotation]
- (add-component changes id path name new-shapes updated-shapes main-instance-id main-instance-page annotation nil nil))
- ([changes id path name new-shapes updated-shapes main-instance-id main-instance-page annotation variant-id variant-properties & {:keys [apply-changes-local-library?]}]
+ ([changes id path name updated-shapes main-instance-id main-instance-page]
+ (add-component changes id path name updated-shapes main-instance-id main-instance-page nil nil nil))
+ ([changes id path name updated-shapes main-instance-id main-instance-page annotation]
+ (add-component changes id path name updated-shapes main-instance-id main-instance-page annotation nil nil))
+ ([changes id path name updated-shapes main-instance-id main-instance-page annotation variant-id variant-properties & {:keys [apply-changes-local-library?]}]
(assert-page-id! changes)
(assert-objects! changes)
(let [page-id (::page-id (meta changes))
@@ -964,11 +964,11 @@
:name name
:main-instance-id main-instance-id
:main-instance-page main-instance-page
- :annotation annotation
- :variant-id variant-id
- :variant-properties variant-properties}
- (some? new-shapes) ;; this will be null in components-v2
- (assoc :shapes (vec new-shapes))))
+ :annotation annotation}
+ (some? variant-id)
+ (assoc :variant-id variant-id)
+ (seq variant-properties)
+ (assoc :variant-properties variant-properties)))
(into (map mk-change) updated-shapes))))
(update :undo-changes
(fn [undo-changes]
@@ -991,27 +991,39 @@
new-component (update-fn prev-component)]
(if prev-component
(-> changes
- (update :redo-changes conj {:type :mod-component
- :id id
- :name (:name new-component)
- :path (:path new-component)
- :main-instance-id (:main-instance-id new-component)
- :main-instance-page (:main-instance-page new-component)
- :annotation (:annotation new-component)
- :variant-id (:variant-id new-component)
- :variant-properties (:variant-properties new-component)
- :objects (:objects new-component) ;; this won't exist in components-v2 (except for deleted components)
- :modified-at (:modified-at new-component)})
- (update :undo-changes conj {:type :mod-component
- :id id
- :name (:name prev-component)
- :path (:path prev-component)
- :main-instance-id (:main-instance-id prev-component)
- :main-instance-page (:main-instance-page prev-component)
- :annotation (:annotation prev-component)
- :variant-id (:variant-id prev-component)
- :variant-properties (:variant-properties prev-component)
- :objects (:objects prev-component)})
+ (update :redo-changes conj (cond-> {:type :mod-component
+ :id id
+ :name (:name new-component)
+ :path (:path new-component)
+ :main-instance-id (:main-instance-id new-component)
+ :main-instance-page (:main-instance-page new-component)
+ :annotation (:annotation new-component)
+ :objects (:objects new-component) ;; for deleted components
+ :modified-at (:modified-at new-component)}
+ (some? (:variant-id new-component))
+ (assoc :variant-id (:variant-id new-component))
+ (nil? (:variant-id new-component))
+ (dissoc :variant-id)
+ (seq (:variant-properties new-component))
+ (assoc :variant-properties (:variant-properties new-component))
+ (not (seq (:variant-properties new-component)))
+ (dissoc :variant-properties)))
+ (update :undo-changes conj (cond-> {:type :mod-component
+ :id id
+ :name (:name prev-component)
+ :path (:path prev-component)
+ :main-instance-id (:main-instance-id prev-component)
+ :main-instance-page (:main-instance-page prev-component)
+ :annotation (:annotation prev-component)
+ :objects (:objects prev-component)}
+ (some? (:variant-id prev-component))
+ (assoc :variant-id (:variant-id prev-component))
+ (nil? (:variant-id prev-component))
+ (dissoc :variant-id)
+ (seq (:variant-properties prev-component))
+ (assoc :variant-properties (:variant-properties prev-component))
+ (not (seq (:variant-properties prev-component)))
+ (dissoc :variant-properties)))
(cond-> apply-changes-local-library?
(apply-changes-local {:apply-to-library? true})))
changes)))
@@ -1027,7 +1039,7 @@
:page-id page-id})))
(defn restore-component
- [changes id page-id main-instance]
+ [changes id page-id delta]
(assert-library! changes)
(-> changes
(update :redo-changes conj {:type :restore-component
@@ -1035,7 +1047,34 @@
:page-id page-id})
(update :undo-changes conj {:type :del-component
:id id
- :main-instance main-instance})))
+ :delta delta})))
+
+(defn reorder-children
+ [changes id children]
+ (assert-page-id! changes)
+ (assert-objects! changes)
+
+ (let [page-id (::page-id (meta changes))
+ objects (lookup-objects changes)
+ shape (get objects id)
+ old-children (:shapes shape)
+
+ redo-change
+ {:type :reorder-children
+ :parent-id (:id shape)
+ :page-id page-id
+ :shapes children}
+
+ undo-change
+ {:type :reorder-children
+ :parent-id (:id shape)
+ :page-id page-id
+ :shapes old-children}]
+
+ (-> changes
+ (update :redo-changes conj redo-change)
+ (update :undo-changes conj undo-change)
+ (apply-changes-local))))
(defn reorder-grid-children
[changes ids]
@@ -1083,3 +1122,11 @@
(defn get-objects
[changes]
(dm/get-in (::file-data (meta changes)) [:pages-index uuid/zero :objects]))
+
+(defn get-page
+ [changes]
+ (::page (meta changes)))
+
+(defn get-page-id
+ [changes]
+ (::page-id (meta changes)))
diff --git a/common/src/app/common/files/helpers.cljc b/common/src/app/common/files/helpers.cljc
index 3795812c34..bb0fb744f7 100644
--- a/common/src/app/common/files/helpers.cljc
+++ b/common/src/app/common/files/helpers.cljc
@@ -427,11 +427,6 @@
(map #(str/concat base-name (suffix-fn %))
(iterate inc 1))))
-(defn ^:private get-suffix
- "Default suffix impelemtation"
- [copy-count]
- (str/concat " " copy-count))
-
(defn generate-unique-name
"Generates a unique name by selecting the first available name from a generated sequence.
The sequence consists of `base-name` and its variants, avoiding conflicts with `existing-names`.
@@ -445,8 +440,7 @@
Returns:
- A unique name not present in `existing-names`."
- [base-name existing-names & {:keys [suffix-fn immediate-suffix?]
- :or {suffix-fn get-suffix}}]
+ [base-name existing-names & {:keys [suffix-fn immediate-suffix? suffix]}]
(dm/assert!
"expected a set of strings"
(coll? existing-names))
@@ -454,9 +448,21 @@
(dm/assert!
"expected a string for `basename`."
(string? base-name))
- (let [existing-name-set (cond-> (set existing-names)
+ (let [suffix-fn (if suffix-fn
+ suffix-fn
+ (if suffix
+ (fn [copy-count]
+ (str/concat "-"
+ suffix
+ (when (> copy-count 1)
+ (str "-" copy-count))))
+ (fn [copy-count]
+ (str/concat " " copy-count))))
+
+ existing-name-set (cond-> (set existing-names)
immediate-suffix? (conj base-name))
names (name-seq base-name suffix-fn)]
+
(->> names
(remove #(contains? existing-name-set %))
first)))
diff --git a/common/src/app/common/files/migrations.cljc b/common/src/app/common/files/migrations.cljc
index d307756f05..7bd2342ae7 100644
--- a/common/src/app/common/files/migrations.cljc
+++ b/common/src/app/common/files/migrations.cljc
@@ -1264,6 +1264,26 @@
(update :pages-index d/update-vals update-container)
(d/update-when :components d/update-vals update-container))))
+(defmethod migrate-data "0002-normalize-bool-content"
+ [data _]
+ (letfn [(update-object [object]
+ ;; NOTE: we still preserve the previous value for possible
+ ;; rollback, we still need to perform an other migration
+ ;; for properly delete the bool-content prop from shapes
+ ;; once the know the migration was OK
+ (if (cfh/bool-shape? object)
+ (if-let [content (:bool-content object)]
+ (assoc object :content content)
+ object)
+ (dissoc object :bool-content :bool-type)))
+
+ (update-container [container]
+ (d/update-when container :objects update-vals update-object))]
+
+ (-> data
+ (update :pages-index update-vals update-container)
+ (update :components update-vals update-container))))
+
(defmethod migrate-data "0003-fix-root-shape"
[data _]
(letfn [(update-object [shape]
@@ -1341,5 +1361,6 @@
"legacy-66"
"legacy-67"
"0001-remove-tokens-from-groups"
+ "0002-normalize-bool-content"
"0002-clean-shape-interactions"
"0003-fix-root-shape"]))
diff --git a/common/src/app/common/files/repair.cljc b/common/src/app/common/files/repair.cljc
index 66fd58c713..bf51851003 100644
--- a/common/src/app/common/files/repair.cljc
+++ b/common/src/app/common/files/repair.cljc
@@ -572,6 +572,51 @@
(pcb/with-file-data file-data)
(pcb/update-shapes [(:id shape)] repair-shape))))
+(defmethod repair-error :not-a-variant
+ [_ error file _]
+ (log/error :hint "Variant error code, we don't want to auto repair it for now" :code (:code error))
+ file)
+
+(defmethod repair-error :invalid-variant-id
+ [_ error file _]
+ (log/error :hint "Variant error code, we don't want to auto repair it for now" :code (:code error))
+ file)
+
+(defmethod repair-error :invalid-variant-properties
+ [_ error file _]
+ (log/error :hint "Variant error code, we don't want to auto repair it for now" :code (:code error))
+ file)
+
+(defmethod repair-error :variant-not-main
+ [_ error file _]
+ (log/error :hint "Variant error code, we don't want to auto repair it for now" :code (:code error))
+ file)
+
+(defmethod repair-error :parent-not-variant
+ [_ error file _]
+ (log/error :hint "Variant error code, we don't want to auto repair it for now" :code (:code error))
+ file)
+
+(defmethod repair-error :variant-bad-name
+ [_ error file _]
+ (log/error :hint "Variant error code, we don't want to auto repair it for now" :code (:code error))
+ file)
+
+(defmethod repair-error :variant-no-properties
+ [_ error file _]
+ (log/error :hint "Variant error code, we don't want to auto repair it for now" :code (:code error))
+ file)
+
+(defmethod repair-error :variant-bad-variant-name
+ [_ error file _]
+ (log/error :hint "Variant error code, we don't want to auto repair it for now" :code (:code error))
+ file)
+
+(defmethod repair-error :variant-component-bad-name
+ [_ error file _]
+ (log/error :hint "Variant error code, we don't want to auto repair it for now" :code (:code error))
+ file)
+
(defmethod repair-error :default
[_ error file _]
(log/error :hint "Unknown error code, don't know how to repair" :code (:code error))
diff --git a/common/src/app/common/files/shapes_helpers.cljc b/common/src/app/common/files/shapes_helpers.cljc
index 772b71e637..e4f265c4c9 100644
--- a/common/src/app/common/files/shapes_helpers.cljc
+++ b/common/src/app/common/files/shapes_helpers.cljc
@@ -62,6 +62,10 @@
changes id parent-id objects selected index frame-name without-fill? nil))
([changes id parent-id objects selected index frame-name without-fill? target-cell-id]
+ (prepare-create-artboard-from-selection
+ changes id parent-id objects selected index frame-name without-fill? target-cell-id nil))
+
+ ([changes id parent-id objects selected index frame-name without-fill? target-cell-id delta]
(when-let [selected-objs (->> selected
(map (d/getf objects))
(not-empty))]
@@ -99,10 +103,11 @@
:id))
target-cell-id)
+
attrs
{:type :frame
- :x (:x srect)
- :y (:y srect)
+ :x (cond-> (:x srect) delta (+ (:x delta)))
+ :y (cond-> (:y srect) delta (+ (:y delta)))
:width (:width srect)
:height (:height srect)}
diff --git a/frontend/src/app/main/ui/workspace/tokens/token.cljs b/common/src/app/common/files/tokens.cljc
similarity index 90%
rename from frontend/src/app/main/ui/workspace/tokens/token.cljs
rename to common/src/app/common/files/tokens.cljc
index 6056d0966b..3a0a632a7f 100644
--- a/frontend/src/app/main/ui/workspace/tokens/token.cljs
+++ b/common/src/app/common/files/tokens.cljc
@@ -1,8 +1,13 @@
-(ns app.main.ui.workspace.tokens.token
+;; 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.common.files.tokens
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
- [app.main.ui.workspace.tokens.tinycolor :as tinycolor]
[clojure.set :as set]
[cuerdas.core :as str]))
@@ -128,18 +133,6 @@
(defn color-token? [token]
(= (:type token) :color))
-
;; FIXME: this should be precalculated ?
(defn is-reference? [token]
(str/includes? (:value token) "{"))
-
-(defn color-bullet-color [token-color-value]
- (when-let [tc (tinycolor/valid-color token-color-value)]
- (if (tinycolor/alpha tc)
- {:color (tinycolor/->hex-string tc)
- :opacity (tinycolor/alpha tc)}
- (tinycolor/->hex-string tc))))
-
-(defn resolved-token-bullet-color [{:keys [resolved-value] :as token}]
- (when (and resolved-value (color-token? token))
- (color-bullet-color resolved-value)))
diff --git a/common/src/app/common/files/validate.cljc b/common/src/app/common/files/validate.cljc
index 8c3746c310..2659f65336 100644
--- a/common/src/app/common/files/validate.cljc
+++ b/common/src/app/common/files/validate.cljc
@@ -10,12 +10,15 @@
[app.common.data.macros :as dm]
[app.common.exceptions :as ex]
[app.common.files.helpers :as cfh]
+ [app.common.files.variant :as cfv]
[app.common.schema :as sm]
[app.common.types.component :as ctk]
+ [app.common.types.components-list :as ctkl]
[app.common.types.container :as ctn]
[app.common.types.file :as ctf]
[app.common.types.pages-list :as ctpl]
[app.common.types.shape-tree :as ctst]
+ [app.common.types.variant :as ctv]
[app.common.uuid :as uuid]
[cuerdas.core :as str]))
@@ -56,7 +59,17 @@
:instance-head-not-frame
:misplaced-slot
:missing-slot
- :shape-ref-cycle})
+ :shape-ref-cycle
+ :not-a-variant
+ :invalid-variant-id
+ :invalid-variant-properties
+ :variant-not-main
+ :parent-not-variant
+ :variant-bad-name
+ :variant-bad-variant-name
+ :variant-component-bad-name
+ :variant-no-properties
+ :variant-component-bad-id})
(def ^:private schema:error
[:map {:title "ValidationError"}
@@ -401,6 +414,68 @@
(check-empty-swap-slot shape file page)
(run! #(check-shape % file page libraries :context :not-component) (:shapes shape)))
+(defn- check-variant-container
+ "Shape is a variant container, so:
+ -all its children should be variants with variant-id equals to the shape-id
+ -all the components should have the same properties
+ "
+ [shape file page]
+ (let [shape-id (:id shape)
+ shapes (:shapes shape)
+ children (map #(ctst/get-shape page %) shapes)
+ prop-names (cfv/extract-properties-names (first children) (:data file))]
+ (doseq [child children]
+ (if (not (ctk/is-variant? child))
+ (report-error :not-a-variant
+ (str/ffmt "Shape % should be a variant" (:id child))
+ child file page)
+ (do
+ (when (not= (:variant-id child) shape-id)
+ (report-error :invalid-variant-id
+ (str/ffmt "Variant % has invalid variant-id %" (:id child) (:variant-id child))
+ child file page))
+ (when (not= prop-names (cfv/extract-properties-names child (:data file)))
+ (report-error :invalid-variant-properties
+ (str/ffmt "Variant % has invalid properties %" (:id child) (vec prop-names))
+ child file page)))))))
+
+(defn- check-variant
+ "Shape is a variant, so
+ -it should be a main component
+ -its parent should be a variant-container
+ -its variant-name is derived from the properties
+ -its name should be tha same as its parent's
+ "
+ [shape file page]
+ (let [parent (ctst/get-shape page (:parent-id shape))
+ component (ctkl/get-component (:data file) (:component-id shape) true)
+ name (ctv/properties-to-name (:variant-properties component))]
+ (when-not (ctk/main-instance? shape)
+ (report-error :variant-not-main
+ (str/ffmt "Variant % is not a main instance" (:id shape))
+ shape file page))
+ (when-not (ctk/is-variant-container? parent)
+ (report-error :parent-not-variant
+ (str/ffmt "Variant % has an invalid parent" (:id shape))
+ shape file page))
+
+ (when-not (= name (:variant-name shape))
+ (report-error :variant-bad-variant-name
+ (str/ffmt "Variant % has an invalid variant-name" (:id shape))
+ shape file page))
+ (when-not (= (:name parent) (:name shape))
+ (report-error :variant-bad-name
+ (str/ffmt "Variant % has an invalid name" (:id shape))
+ shape file page))
+ (when-not (= (:name parent) (cfh/merge-path-item (:path component) (:name component)))
+ (report-error :variant-component-bad-name
+ (str/ffmt "Component % has an invalid name" (:id shape))
+ shape file page))
+ (when-not (= (:variant-id component) (:variant-id shape))
+ (report-error :variant-component-bad-id
+ (str/ffmt "Variant % has adifferent variant-id than its component" (:id shape))
+ shape file page))))
+
(defn- check-shape
"Validate referential integrity and semantic coherence of
a shape and all its children. Report all errors found.
@@ -421,6 +496,12 @@
(check-parent-children shape file page)
(check-frame shape file page)
+ (when (ctk/is-variant-container? shape)
+ (check-variant-container shape file page))
+
+ (when (ctk/is-variant? shape)
+ (check-variant shape file page))
+
(if (ctk/instance-head? shape)
(if (not= :frame (:type shape))
(report-error :instance-head-not-frame
@@ -496,6 +577,24 @@
"This deleted component has shapes with shape-ref pointing to self"
component file nil :cycles-ids cycles-ids))))
+(defn- check-variant-component
+ "Component is a variant, so:
+ -Its main should be a variant
+ -It should have at least one variant property"
+ [component file]
+ (let [component-page (ctf/get-component-page (:data file) component)
+ main-component (if (:deleted component)
+ (dm/get-in component [:objects (:main-instance-id component)])
+ (ctst/get-shape component-page (:main-instance-id component)))]
+ (when-not (ctk/is-variant? main-component)
+ (report-error :not-a-variant
+ (str/ffmt "Shape % should be a variant" (:id main-component))
+ main-component file component-page))
+ (when (< (count (:variant-properties component)) 1)
+ (report-error :variant-no-properties
+ (str/ffmt "Component variant % should have properties" (:id main-component))
+ main-component file nil))))
+
(defn- check-component
"Validate semantic coherence of a component. Report all errors found."
[component file]
@@ -505,7 +604,10 @@
component file nil))
(when (:deleted component)
(check-component-duplicate-swap-slot component file)
- (check-ref-cycles component file)))
+ (check-ref-cycles component file))
+
+ (when (ctk/is-variant? component)
+ (check-variant-component component file)))
(defn- get-orphan-shapes
[{:keys [objects] :as page}]
diff --git a/common/src/app/common/files/variant.cljc b/common/src/app/common/files/variant.cljc
new file mode 100644
index 0000000000..e901fd19ef
--- /dev/null
+++ b/common/src/app/common/files/variant.cljc
@@ -0,0 +1,84 @@
+;; 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.common.files.variant
+ (:require
+ [app.common.data.macros :as dm]
+ [app.common.types.component :as ctc]
+ [app.common.types.components-list :as ctcl]
+ [app.common.types.variant :as ctv]
+ [cuerdas.core :as str]))
+
+
+(defn find-variant-components
+ "Find a list of the components thet belongs to this variant-id"
+ [data objects variant-id]
+ ;; We can't simply filter components, because we need to maintain the order
+ (->> (dm/get-in objects [variant-id :shapes])
+ (map #(dm/get-in objects [% :component-id]))
+ (map #(ctcl/get-component data % true))
+ reverse))
+
+(defn- dashes-to-end
+ [property-values]
+ (let [dashes (if (some #(= % "--") property-values) ["--"] [])]
+ (concat (remove #(= % "--") property-values) dashes)))
+
+
+(defn extract-properties-names
+ [shape data]
+ (->> shape
+ (#(ctcl/get-component data (:component-id %) true))
+ :variant-properties
+ (map :name)))
+
+
+(defn extract-properties-values
+ [data objects variant-id]
+ (->> (find-variant-components data objects variant-id)
+ (mapcat :variant-properties)
+ (group-by :name)
+ (map (fn [[k v]]
+ {:name k
+ :value (->> v
+ (map #(if (str/empty? (:value %)) "--" (:value %)))
+ distinct
+ dashes-to-end)}))))
+
+(defn get-variant-mains
+ [component data]
+ (assert (ctv/valid-variant-component? component) "expected valid component variant")
+ (when-let [variant-id (:variant-id component)]
+ (let [page-id (:main-instance-page component)
+ objects (-> (dm/get-in data [:pages-index page-id])
+ (get :objects))]
+ (dm/get-in objects [variant-id :shapes]))))
+
+
+(defn is-secondary-variant?
+ [component data]
+ (let [shapes (get-variant-mains component data)]
+ (and (seq shapes)
+ (not= (:main-instance-id component) (last shapes)))))
+
+(defn get-primary-variant
+ [data component]
+ (let [page-id (:main-instance-page component)
+ objects (-> (dm/get-in data [:pages-index page-id])
+ (get :objects))
+ variant-id (:variant-id component)]
+ (->> (dm/get-in objects [variant-id :shapes])
+ peek
+ (get objects))))
+
+(defn get-primary-component
+ [data component-id]
+ (when-let [component (ctcl/get-component data component-id)]
+ (if (ctc/is-variant? component)
+ (->> component
+ (get-primary-variant data)
+ :component-id
+ (ctcl/get-component data))
+ component)))
diff --git a/common/src/app/common/flags.cljc b/common/src/app/common/flags.cljc
index dbc39e5041..371d889230 100644
--- a/common/src/app/common/flags.cljc
+++ b/common/src/app/common/flags.cljc
@@ -79,7 +79,7 @@
:file-schema-validation
;; Reports the schema validation errors internally.
:soft-file-schema-validation
- ;; Activates the referential integrity validation during update file; related to components-v2.
+ ;; Activates the referential integrity validation during update file.
:file-validation
;; Reports the referential integrity validation errors internally.
:soft-file-validation
@@ -125,6 +125,7 @@
:export-file-v3
:render-wasm-dpr
:hide-release-modal
+ :subscriptions
:subscriptions-old})
(def all-flags
diff --git a/common/src/app/common/geom/shapes/grid_layout/layout_data.cljc b/common/src/app/common/geom/shapes/grid_layout/layout_data.cljc
index d994cae10c..424dcbb34f 100644
--- a/common/src/app/common/geom/shapes/grid_layout/layout_data.cljc
+++ b/common/src/app/common/geom/shapes/grid_layout/layout_data.cljc
@@ -39,7 +39,7 @@
;;
;; 5. If any track still has an infinite growth limit set its growth limit to its base size.
-;; - Distribute extra space accross spaned tracks
+;; - Distribute extra space accross spaned tracks
;; - Maximize tracks
;;
;; - Expand flexible tracks
@@ -198,7 +198,7 @@
track-list))
-(defn add-auto-size
+(defn stretch-tracks
[track-list add-size]
(->> track-list
(mapv (fn [{:keys [type size max-size] :as track}]
@@ -357,7 +357,8 @@
to-idx (+ (dec (get cell prop)) (get cell prop-span))
indexed-tracks (subvec (d/enumerate track-list) from-idx to-idx)
- to-allocate (size-to-allocate type parent (get children-map shape-id) cell bounds objects)
+ to-allocate
+ (size-to-allocate type parent (get children-map shape-id) cell bounds objects)
;; Remove the size and the tracks that are not allocated
[to-allocate total-frs indexed-tracks]
@@ -493,11 +494,11 @@
column-tracks (cond-> column-tracks
(= :stretch (:layout-justify-content parent))
- (add-auto-size column-add-auto))
+ (stretch-tracks column-add-auto))
row-tracks (cond-> row-tracks
(= :stretch (:layout-align-content parent))
- (add-auto-size row-add-auto))
+ (stretch-tracks row-add-auto))
column-total-size (tracks-total-size column-tracks)
row-total-size (tracks-total-size row-tracks)
diff --git a/common/src/app/common/geom/shapes/path.cljc b/common/src/app/common/geom/shapes/path.cljc
index c9863d9f3d..a7e56f3d2a 100644
--- a/common/src/app/common/geom/shapes/path.cljc
+++ b/common/src/app/common/geom/shapes/path.cljc
@@ -347,7 +347,11 @@
move-p nil
content (seq content)]
(if content
- (let [command (first content)
+ (let [last-p (last content)
+ content (if (= :move-to (:command last-p))
+ (butlast content)
+ content)
+ command (first content)
to-p (command->point command)
[from-p move-p command-pts]
diff --git a/common/src/app/common/geom/shapes/transforms.cljc b/common/src/app/common/geom/shapes/transforms.cljc
index af52ac238e..50a41e06f3 100644
--- a/common/src/app/common/geom/shapes/transforms.cljc
+++ b/common/src/app/common/geom/shapes/transforms.cljc
@@ -95,8 +95,8 @@
(d/update-when :x d/safe+ dx)
(d/update-when :y d/safe+ dy)
(d/update-when :position-data move-position-data mvec)
- (cond-> (= :bool type) (update :bool-content gpa/move-content mvec))
- (cond-> (= :path type) (update :content gpa/move-content mvec)))))
+ (cond-> (or (= :bool type) (= :path type))
+ (update :content gpa/move-content mvec)))))
;; --- Absolute Movement
@@ -317,13 +317,10 @@
points (gco/transform-points (dm/get-prop shape :points) transform-mtx)
selrect (gco/transform-selrect (dm/get-prop shape :selrect) transform-mtx)
- shape (if (= type :bool)
- (update shape :bool-content gpa/transform-content transform-mtx)
- shape)
shape (if (= type :text)
(update shape :position-data transform-position-data transform-mtx)
shape)
- shape (if (= type :path)
+ shape (if (or (= type :path) (= type :bool))
(update shape :content gpa/transform-content transform-mtx)
(assoc shape
:x (dm/get-prop selrect :x)
@@ -355,11 +352,8 @@
rotation (mod (+ (d/nilv (:rotation shape) 0)
(d/nilv (dm/get-in shape [:modifiers :rotation]) 0))
360)
- shape (if (= type :bool)
- (update shape :bool-content gpa/transform-content transform-mtx)
- shape)
- shape (if (= type :path)
+ shape (if (or (= type :path) (= type :bool))
(update shape :content gpa/transform-content transform-mtx)
(assoc shape
:x (dm/get-prop selrect :x)
@@ -454,9 +448,14 @@
"Calculates the selrect+points for the boolean shape"
[shape children objects]
- (let [bool-content (gshb/calc-bool-content shape objects)
- shape (assoc shape :bool-content bool-content)
- [points selrect] (gpa/content->points+selrect shape bool-content)]
+ (let [content
+ (gshb/calc-bool-content shape objects)
+
+ shape
+ (assoc shape :content content)
+
+ [points selrect]
+ (gpa/content->points+selrect shape content)]
(if (and (some? selrect) (d/not-empty? points))
(-> shape
diff --git a/common/src/app/common/logic/libraries.cljc b/common/src/app/common/logic/libraries.cljc
index 9413e97964..631db173a1 100644
--- a/common/src/app/common/logic/libraries.cljc
+++ b/common/src/app/common/logic/libraries.cljc
@@ -15,6 +15,7 @@
[app.common.geom.shapes :as gsh]
[app.common.logging :as log]
[app.common.logic.shapes :as cls]
+ [app.common.logic.variant-properties :as clvp]
[app.common.spec :as us]
[app.common.text :as txt]
[app.common.types.color :as ctc]
@@ -29,6 +30,7 @@
[app.common.types.shape.layout :as ctl]
[app.common.types.token :as cto]
[app.common.types.typography :as cty]
+ [app.common.types.variant :as ctv]
[app.common.uuid :as uuid]
[clojure.set :as set]
[clojure.spec.alpha :as s]))
@@ -105,113 +107,99 @@
(defn- duplicate-component
"Clone the root shape of the component and all children. Generate new
ids from all of them."
- [component new-component-id library-data force-id]
- (let [components-v2 (dm/get-in library-data [:options :components-v2])]
- (if components-v2
- (let [main-instance-page (ctf/get-component-page library-data component)
- main-instance-shape (ctf/get-component-root library-data component)
- delta (gpt/point (+ (:width main-instance-shape) 50) 0)
+ [component new-component-id library-data force-id delta variant-id]
+ (let [main-instance-page (ctf/get-component-page library-data component)
+ main-instance-shape (ctf/get-component-root library-data component)
+ delta (or delta (gpt/point (+ (:width main-instance-shape) 50) 0))
- ids-map (volatile! {})
- inverted-ids-map (volatile! {})
- nested-main-heads (volatile! #{})
+ ids-map (volatile! {})
+ inverted-ids-map (volatile! {})
+ nested-main-heads (volatile! #{})
- update-original-shape
- (fn [original-shape new-shape]
+ update-original-shape
+ (fn [original-shape new-shape]
; Save some ids for later
- (vswap! ids-map assoc (:id original-shape) (:id new-shape))
- (vswap! inverted-ids-map assoc (:id new-shape) (:id original-shape))
- (when (and (ctk/main-instance? original-shape)
- (not= (:component-id original-shape) (:id component)))
- (vswap! nested-main-heads conj (:id original-shape)))
- original-shape)
+ (vswap! ids-map assoc (:id original-shape) (:id new-shape))
+ (vswap! inverted-ids-map assoc (:id new-shape) (:id original-shape))
+ (when (and (ctk/main-instance? original-shape)
+ (not= (:component-id original-shape) (:id component)))
+ (vswap! nested-main-heads conj (:id original-shape)))
+ original-shape)
- update-new-shape
- (fn [new-shape _]
- (cond-> new-shape
- ; Link the new main to the new component
- (= (:component-id new-shape) (:id component))
- (assoc :component-id new-component-id)
+ update-new-shape
+ (fn [new-shape _]
+ (cond-> new-shape
+ ; Link the new main to the new component
+ (= (:component-id new-shape) (:id component))
+ (assoc :component-id new-component-id)
- :always
- (gsh/move delta)))
+ ; If it is the instance root, add it the variant-id
+ (and (ctk/instance-root? new-shape) (some? variant-id))
+ (assoc :variant-id variant-id)
- [new-instance-shape new-instance-shapes _]
- (ctst/clone-shape main-instance-shape
- (:parent-id main-instance-shape)
- (:objects main-instance-page)
- :update-new-shape update-new-shape
- :update-original-shape update-original-shape
- :force-id force-id)
+ :always
+ (gsh/move delta)))
- remap-frame
- (fn [shape]
+ [new-instance-shape new-instance-shapes _]
+ (ctst/clone-shape main-instance-shape
+ (:parent-id main-instance-shape)
+ (:objects main-instance-page)
+ :update-new-shape update-new-shape
+ :update-original-shape update-original-shape
+ :force-id force-id)
+ remap-frame
+ (fn [shape]
; Remap all frame-ids internal to the component to the new shapes
- (update shape :frame-id
- #(get @ids-map % (:frame-id shape))))
+ (update shape :frame-id
+ #(get @ids-map % (:frame-id shape))))
- convert-nested-main
- (fn [shape]
+ convert-nested-main
+ (fn [shape]
; If there is some nested main instance, convert it into a copy of
; main nested in the original component.
- (let [origin-shape-id (get @inverted-ids-map (:id shape))
- objects (:objects main-instance-page)
- parent-ids (cfh/get-parent-ids-seq-with-self objects origin-shape-id)]
- (cond-> shape
- (@nested-main-heads origin-shape-id)
- (dissoc :main-instance)
+ (let [origin-shape-id (get @inverted-ids-map (:id shape))
+ objects (:objects main-instance-page)
+ parent-ids (cfh/get-parent-ids-seq-with-self objects origin-shape-id)]
+ (cond-> shape
+ (@nested-main-heads origin-shape-id)
+ (dissoc :main-instance)
- (some @nested-main-heads parent-ids)
- (assoc :shape-ref origin-shape-id))))
+ (some @nested-main-heads parent-ids)
+ (assoc :shape-ref origin-shape-id))))
- xf-shape (comp (map remap-frame)
- (map convert-nested-main))
+ xf-shape (comp (map remap-frame)
+ (map convert-nested-main))
- new-instance-shapes (into [] xf-shape new-instance-shapes)]
+ new-instance-shapes (into [] xf-shape new-instance-shapes)]
- [nil nil new-instance-shape new-instance-shapes])
-
- (let [component-root (d/seek #(nil? (:parent-id %)) (vals (:objects component)))
-
- [new-component-shape new-component-shapes _]
- (ctst/clone-shape component-root
- nil
- (get component :objects))]
-
- [new-component-shape new-component-shapes nil nil]))))
+ [new-instance-shape new-instance-shapes]))
(defn generate-duplicate-component
"Create a new component copied from the one with the given id."
- [changes library component-id new-component-id components-v2 & {:keys [new-shape-id apply-changes-local-library?]}]
+ [changes library component-id new-component-id & {:keys [new-shape-id apply-changes-local-library? delta new-variant-id page-id]}]
(let [component (ctkl/get-component (:data library) component-id)
new-name (:name component)
- main-instance-page (when components-v2
- (ctf/get-component-page (:data library) component))
+ main-instance-page (ctf/get-component-page (:data library) component)
+ ;; Since variants, we can duplicate a component into another page
+ target-page-id (or page-id (:id main-instance-page))
- new-component-id (when components-v2
- new-component-id)
-
- [new-component-shape new-component-shapes ; <- null in components-v2
- new-main-instance-shape new-main-instance-shapes]
- (duplicate-component component new-component-id (:data library) new-shape-id)]
+ [new-main-instance-shape new-main-instance-shapes]
+ (duplicate-component component new-component-id (:data library) new-shape-id delta new-variant-id)]
[new-main-instance-shape
(-> changes
- (pcb/with-page main-instance-page)
+ (pcb/with-page-id target-page-id)
(pcb/with-objects (:objects main-instance-page))
(pcb/add-objects new-main-instance-shapes {:ignore-touched true})
- (pcb/add-component (if components-v2
- new-component-id
- (:id new-component-shape))
+ (pcb/add-component new-component-id
(:path component)
new-name
- new-component-shapes
[]
(:id new-main-instance-shape)
- (:id main-instance-page)
+ target-page-id
(:annotation component)
- (:variant-id component)
+ (or new-variant-id (:variant-id component))
(:variant-properties component)
{:apply-changes-local-library? apply-changes-local-library?})
;; Update grid layout if the new main instance is inside
@@ -228,23 +216,34 @@
"Generate changes to create a new instance from a component."
([changes objects file-id component-id position page libraries]
(generate-instantiate-component changes objects file-id component-id position page libraries nil nil nil {}))
-
- ([changes objects file-id component-id position page libraries old-id parent-id frame-id
+ ([changes objects file-id component-id position page libraries old-id parent-id frame-id params]
+ (generate-instantiate-component changes objects file-id component-id position page libraries old-id parent-id frame-id {} params))
+ ([changes objects file-id component-id position page libraries old-id parent-id frame-id ids-map
{:keys [force-frame?]
:or {force-frame? false}}]
- (let [component (ctf/get-component libraries file-id component-id)
- parent (when parent-id (get objects parent-id))
- library (get libraries file-id)
- components-v2 (dm/get-in library [:data :options :components-v2])
+ (let [component (ctf/get-component libraries file-id component-id)
+ library (get libraries file-id)
+ parent (when parent-id (get objects parent-id))
+
+ ;; When we are intanciating a variant, it can't be on a variant-container
+ parent (when parent
+ (if (and (ctk/is-variant? component)
+ (ctk/is-variant-container? parent))
+ (get objects (:parent-id parent))
+ parent))
+ parent-id (d/nilv (:id parent) parent-id)
+ frame-id (d/nilv (:frame-id parent) frame-id)
[new-shape new-shapes]
(ctn/make-component-instance page
component
(:data library)
position
- components-v2
(cond-> {}
+ (contains? ids-map old-id)
+ (assoc :force-id (get ids-map old-id))
+
force-frame?
(assoc :force-frame-id frame-id)))
@@ -266,8 +265,11 @@
(cond-> (pcb/add-object changes first-shape {:ignore-touched true})
(some? old-id) (pcb/amend-last-change #(assoc % :old-id old-id)))
+ duplicated-parent?
+ (->> ids-map vals (some #(= % (:parent-id first-shape))))
+
changes
- (if (ctl/grid-layout? objects (:parent-id first-shape))
+ (if (and (ctl/grid-layout? objects (:parent-id first-shape)) (not duplicated-parent?))
(let [target-cell (-> position meta :cell)
[row column]
@@ -394,17 +396,28 @@
(when (some #(= (:id current-page) %) (:pages library-data)) ;; If the page doesn't belong to the library, it's not valid
current-page)
(ctpl/get-last-page library-data))]
- (prepare-restore-component changes library-data component-id page (gpt/point 0 0) nil nil nil)))
+ (prepare-restore-component changes library-data component-id page nil nil nil nil)))
- ([changes library-data component-id page delta old-id parent-id frame-id]
- (let [component (ctkl/get-deleted-component library-data component-id)
- parent (get-in page [:objects parent-id])
+ ([changes library-data component-id page position old-id parent-id frame-id]
+ (let [library-data (or (pcb/get-library-data changes) library-data)
+ component (ctkl/get-deleted-component library-data component-id)
+ objects (or (pcb/get-objects changes) (:objects page))
+ parent (get objects parent-id)
main-inst (get-in component [:objects (:main-instance-id component)])
inside-component? (some? (ctn/get-instance-root (:objects page) parent))
shapes (cfh/get-children-with-self (:objects component) (:main-instance-id component))
- shapes (map #(gsh/move % delta) shapes)
- first-shape (cond-> (first shapes)
+ is-variant? (ctk/is-variant? component)
+
+ orig-pos (gpt/point (:x main-inst) (:y main-inst))
+ delta (if position
+ (gpt/subtract position orig-pos)
+ (gpt/point 0 0))
+ minusdelta (gpt/point (- (:x delta)) (- (:y delta)))
+
+ moved-shapes (map #(gsh/move % delta) shapes)
+
+ first-shape (cond-> (first moved-shapes)
(not (nil? parent-id))
(assoc :parent-id parent-id)
(not (nil? frame-id))
@@ -426,9 +439,16 @@
(some? old-id) (pcb/amend-last-change #(assoc % :old-id old-id))) ; on copy/paste old id is used later to reorder the paster layers
changes (reduce #(pcb/add-object %1 %2 {:ignore-touched true})
changes
- (rest shapes))]
- {:changes (pcb/restore-component changes component-id (:id page) main-inst)
- :shape (first shapes)})))
+ (rest moved-shapes))
+ changes (cond-> changes
+ ;; Remove variant info when restoring into a parent that is not a variant-container
+ (and is-variant? parent (not (ctk/is-variant-container? parent)))
+ (clvp/generate-make-shapes-no-variant [first-shape])
+ ;; Add variant info and rename when restoring into a variant-container
+ (ctk/is-variant-container? parent)
+ (clvp/generate-make-shapes-variant [first-shape] parent))]
+ {:changes (pcb/restore-component changes component-id (:id page) minusdelta)
+ :shape (first moved-shapes)})))
;; ---- General library synchronization functions ----
@@ -451,8 +471,7 @@
:file (pretty-file file-id libraries current-file-id)
:library (pretty-file library-id libraries current-file-id))
- (let [file (get-in libraries [file-id :data])
- components-v2 (get-in file [:options :components-v2])]
+ (let [file (get-in libraries [file-id :data])]
(loop [containers (ctf/object-containers-seq file)
changes changes]
(if-let [container (first containers)]
@@ -465,7 +484,6 @@
asset-id
library-id
container
- components-v2
libraries
current-file-id))))
changes))))
@@ -490,8 +508,7 @@
:file (pretty-file file-id libraries current-file-id)
:library (pretty-file library-id libraries current-file-id))
- (let [file (get-in libraries [file-id :data])
- components-v2 (get-in file [:options :components-v2])]
+ (let [file (get-in libraries [file-id :data])]
(loop [local-components (ctkl/components-seq file)
changes changes]
(if-let [local-component (first local-components)]
@@ -503,7 +520,6 @@
asset-id
library-id
(cfh/make-container local-component :component)
- components-v2
libraries
current-file-id)))
changes))))
@@ -511,7 +527,7 @@
(defn- generate-sync-container
"Generate changes to synchronize all shapes in a particular container (a page
or a component) that use assets of the given type in the given library."
- [changes asset-type asset-id library-id container components-v2 libraries current-file-id]
+ [changes asset-type asset-id library-id container libraries current-file-id]
(if (cfh/page? container)
(container-log :debug (:id container) :msg "Sync page in local file" :page-id (:id container))
@@ -530,7 +546,6 @@
library-id
container
shape
- components-v2
libraries
current-file-id))
changes))))
@@ -560,13 +575,13 @@
(defmulti generate-sync-shape
"Generate changes to synchronize one shape from all assets of the given type
that is using, in the given library."
- (fn [asset-type _changes _library-id _container _shape _components-v2 _libraries _current-file-id] asset-type))
+ (fn [asset-type _changes _library-id _container _shape _libraries _current-file-id] asset-type))
(defmethod generate-sync-shape :components
- [_ changes _library-id container shape components-v2 libraries current-file-id]
+ [_ changes _library-id container shape libraries current-file-id]
(let [shape-id (:id shape)
file (get current-file-id libraries)]
- (generate-sync-shape-direct changes file libraries container shape-id false components-v2)))
+ (generate-sync-shape-direct changes file libraries container shape-id false)))
(defmethod generate-sync-shape :colors
[_ changes library-id _ shape _ libraries _]
@@ -742,7 +757,7 @@
(defn generate-sync-shape-direct
"Generate changes to synchronize one shape that is the root of a component
instance, and all its children, from the given component."
- [changes file libraries container shape-id reset? components-v2]
+ [changes file libraries container shape-id reset?]
(shape-log :debug shape-id container
:msg "Sync shape direct" :shape-inst (str shape-id) :reset? reset?)
(let [shape-inst (ctn/get-shape container shape-id)
@@ -753,12 +768,12 @@
(let [redirect-shaperef (partial redirect-shaperef container libraries)
shape-main (when component
- (if (and reset? components-v2)
+ (if reset?
;; the reset is against the ref-shape, not against the original shape of the component
(ctf/find-ref-shape file container libraries shape-inst)
(ctf/get-ref-shape library component shape-inst)))
- shape-inst (if (and reset? components-v2)
+ shape-inst (if reset?
(redirect-shaperef shape-inst shape-main)
shape-inst)
@@ -780,13 +795,10 @@
root-main
reset?
initial-root?
- redirect-shaperef
- components-v2)
+ redirect-shaperef)
;; If the component is not found, because the master component has been
- ;; deleted or the library unlinked, do nothing in v2 or detach in v1.
- (if components-v2
- changes
- (generate-detach-instance changes libraries container shape-id))))
+ ;; deleted or the library unlinked, do nothing.
+ changes))
changes)))
(defn- find-main-container
@@ -807,7 +819,7 @@
nil))))))
(defn- generate-sync-shape-direct-recursive
- [changes container shape-inst component library file libraries shape-main root-inst root-main reset? initial-root? redirect-shaperef components-v2]
+ [changes container shape-inst component library file libraries shape-main root-inst root-main reset? initial-root? redirect-shaperef]
(shape-log :debug (:id shape-inst) container
:msg "Sync shape direct recursive"
:shape-inst (str (:name shape-inst) " " (pretty-uuid (:id shape-inst)))
@@ -815,9 +827,7 @@
(if (nil? shape-main)
;; This should not occur, but protect against it in any case
- (if components-v2
- changes
- (generate-detach-instance changes container {(:id library) library} (:id shape-inst)))
+ changes
(let [omit-touched? (not reset?)
clear-remote-synced? (and initial-root? reset?)
set-remote-synced? (and (not initial-root?) reset?)
@@ -856,7 +866,7 @@
children-inst (vec (ctn/get-direct-children container shape-inst))
children-main (vec (ctn/get-direct-children component-container shape-main))
- children-inst (if (and reset? components-v2)
+ children-inst (if reset?
(map #(redirect-shaperef %) children-inst) children-inst)
only-inst (fn [changes child-inst]
@@ -888,8 +898,7 @@
root-inst
root-main
omit-touched?
- set-remote-synced?
- components-v2)
+ set-remote-synced?)
changes))
both (fn [changes child-inst child-main]
@@ -909,8 +918,7 @@
root-main
reset?
initial-root?
- redirect-shaperef
- components-v2))
+ redirect-shaperef))
swapped (fn [changes child-inst child-main]
(shape-log :trace (:id child-inst) container
@@ -948,8 +956,7 @@
swapped
moved
false
- reset?
- components-v2)
+ reset?)
changes
(cond-> changes
@@ -965,41 +972,26 @@
(defn generate-rename-component
"Generate the changes for rename the component with the given id, in the current file library."
- [changes id new-name library-data components-v2]
- (let [[path name] (cfh/parse-path-name new-name)
- update-fn
- (fn [component]
- (cond-> component
- :always
- (assoc :path path
- :name name)
-
- (not components-v2)
- (update :objects
- ;; Give the same name to the root shape
- #(assoc-in % [id :name] name))))]
+ [changes id new-name library-data]
+ (let [[path name] (cfh/parse-path-name new-name)]
(-> changes
(pcb/with-library-data library-data)
- (pcb/update-component id update-fn))))
+ (pcb/update-component id #(assoc % :path path :name name)))))
(defn generate-sync-shape-inverse
"Generate changes to update the component a shape is linked to, from
the values in the shape and all its children."
- [changes file libraries container shape-id components-v2]
+ [changes file libraries container shape-id]
(shape-log :debug shape-id container :msg "Sync shape inverse" :shape (str shape-id))
(let [redirect-shaperef (partial redirect-shaperef container libraries)
shape-inst (ctn/get-shape container shape-id)
library (dm/get-in libraries [(:component-file shape-inst) :data])
component (ctkl/get-component library (:component-id shape-inst))
- shape-main (when component
- (if components-v2
- (ctf/find-remote-shape container libraries shape-inst)
- (ctf/get-ref-shape library component shape-inst)))
+ shape-main (when component
+ (ctf/find-remote-shape container libraries shape-inst))
- shape-inst (if components-v2
- (redirect-shaperef shape-inst shape-main)
- shape-inst)
+ shape-inst (redirect-shaperef shape-inst shape-main)
initial-root? (:component-root shape-inst)
@@ -1008,7 +1000,7 @@
changes (cond-> changes
(and component (contains? (:touched shape-inst) :name-group))
- (generate-rename-component (:component-id shape-inst) (:name shape-inst) library components-v2))]
+ (generate-rename-component (:component-id shape-inst) (:name shape-inst) library))]
(if component
(generate-sync-shape-inverse-recursive changes
@@ -1022,12 +1014,11 @@
root-inst
root-main
initial-root?
- redirect-shaperef
- components-v2)
+ redirect-shaperef)
changes)))
(defn- generate-sync-shape-inverse-recursive
- [changes container shape-inst component library file libraries shape-main root-inst root-main initial-root? redirect-shaperef components-v2]
+ [changes container shape-inst component library file libraries shape-main root-inst root-main initial-root? redirect-shaperef]
(shape-log :trace (:id shape-inst) container
:msg "Sync shape inverse recursive"
:shape (str (:name shape-inst))
@@ -1084,9 +1075,7 @@
children-main (mapv #(ctn/get-shape component-container %)
(:shapes shape-main))
- children-inst (if components-v2
- (map #(redirect-shaperef %) children-inst)
- children-inst)
+ children-inst (map #(redirect-shaperef %) children-inst)
only-inst (fn [changes child-inst]
(add-shape-to-main changes
@@ -1097,8 +1086,7 @@
component-container
container
root-inst
- root-main
- components-v2))
+ root-main))
only-main (fn [changes child-main]
(remove-shape changes
@@ -1118,8 +1106,7 @@
root-inst
root-main
initial-root?
- redirect-shaperef
- components-v2))
+ redirect-shaperef))
swapped (fn [changes child-inst child-main]
(shape-log :trace (:id child-inst) container
@@ -1153,8 +1140,7 @@
swapped
moved
true
- true
- components-v2)
+ true)
;; The inverse sync may be made on a component that is inside a
;; remote library. We need to separate changes that are from
@@ -1172,7 +1158,7 @@
;; ---- Operation generation helpers ----
(defn- compare-children
- [changes shape-inst children-inst children-main container-inst container-main file libraries only-inst-cb only-main-cb both-cb swapped-cb moved-cb inverse? reset? components-v2]
+ [changes shape-inst children-inst children-main container-inst container-main file libraries only-inst-cb only-main-cb both-cb swapped-cb moved-cb inverse? reset?]
(shape-log :trace (:id shape-inst) container-inst :msg "Compare children")
(loop [children-inst (seq (or children-inst []))
children-main (seq (or children-main []))
@@ -1193,18 +1179,18 @@
(reduce only-inst-cb changes children-inst)
:else
- (if (or (ctk/is-main-of? child-main child-inst components-v2)
+ (if (or (ctk/is-main-of? child-main child-inst)
(and (ctf/match-swap-slot? child-main child-inst container-inst container-main file libraries) (not reset?)))
(recur (next children-inst)
(next children-main)
- (if (ctk/is-main-of? child-main child-inst components-v2)
+ (if (ctk/is-main-of? child-main child-inst)
(both-cb changes child-inst child-main)
(swapped-cb changes child-inst child-main)))
- (let [child-inst' (d/seek #(or (ctk/is-main-of? child-main % components-v2)
+ (let [child-inst' (d/seek #(or (ctk/is-main-of? child-main %)
(and (ctf/match-swap-slot? child-main % container-inst container-main file libraries) (not reset?)))
children-inst)
- child-main' (d/seek #(or (ctk/is-main-of? % child-inst components-v2)
+ child-main' (d/seek #(or (ctk/is-main-of? % child-inst)
(and (ctf/match-swap-slot? % child-inst container-inst container-main file libraries) (not reset?)))
children-main)]
(cond
@@ -1220,7 +1206,7 @@
:else
(if inverse?
- (let [is-main? (ctk/is-main-of? child-inst child-main' components-v2)]
+ (let [is-main? (ctk/is-main-of? child-inst child-main')]
(recur (next children-inst)
(remove #(= (:id %) (:id child-main')) children-main)
(cond-> changes
@@ -1230,7 +1216,7 @@
(swapped-cb child-inst child-main')
:always
(moved-cb child-inst child-main'))))
- (let [is-main? (ctk/is-main-of? child-inst' child-main components-v2)]
+ (let [is-main? (ctk/is-main-of? child-inst' child-main)]
(recur (remove #(= (:id %) (:id child-inst')) children-inst)
(next children-main)
(cond-> changes
@@ -1242,14 +1228,14 @@
(moved-cb child-inst' child-main))))))))))))
(defn- add-shape-to-instance
- [changes component-shape index component-page container root-instance root-main omit-touched? set-remote-synced? components-v2]
+ [changes component-shape index component-page container root-instance root-main omit-touched? set-remote-synced?]
(shape-log :info (:id component-shape) component-page
:msg (str "ADD [P " (pretty-uuid (:id container)) "] "
(:name component-shape)
" "
(pretty-uuid (:id component-shape))))
(let [component-parent-shape (ctn/get-shape component-page (:parent-id component-shape))
- parent-shape (d/seek #(ctk/is-main-of? component-parent-shape % components-v2)
+ parent-shape (d/seek #(ctk/is-main-of? component-parent-shape %)
(cfh/get-children-with-self (:objects container)
(:id root-instance)))
all-parents (into [(:id parent-shape)]
@@ -1318,14 +1304,14 @@
changes')))
(defn- add-shape-to-main
- [changes shape index component component-container page root-instance root-main components-v2]
+ [changes shape index component component-container page root-instance root-main]
(shape-log :info (:id shape) page
:msg (str "ADD [C " (pretty-uuid (:id component-container)) "] "
(:name shape)
" "
(pretty-uuid (:id shape))))
(let [parent-shape (ctn/get-shape page (:parent-id shape))
- component-parent-shape (d/seek #(ctk/is-main-of? % parent-shape components-v2)
+ component-parent-shape (d/seek #(ctk/is-main-of? % parent-shape)
(cfh/get-children-with-self (:objects component-container)
(:id root-main)))
all-parents (into [(:id component-parent-shape)]
@@ -1910,30 +1896,33 @@
(assoc change :component-id (:id container))))
(defn generate-add-component-changes
- [changes root objects file-id page-id components-v2]
+ [changes root objects file-id page-id variant-props]
(let [name (:name root)
+ variant-id (when (ctk/is-variant? root) (:parent-id root))
+ props (when (ctk/is-variant? root) (get variant-props (:component-id root)))
+
[path name] (cfh/parse-path-name name)
- [root-shape new-shapes updated-shapes]
- (if-not components-v2
- (ctn/make-component-shape root objects file-id components-v2)
- (ctn/convert-shape-in-component root objects file-id))
+ [root-shape updated-shapes]
+ (ctn/convert-shape-in-component root objects file-id)
- changes (-> changes
- (pcb/add-component (:id root-shape)
- path
- name
- new-shapes
- updated-shapes
- (:id root)
- page-id))]
+ changes (-> changes
+ (pcb/add-component (:id root-shape)
+ path
+ name
+ updated-shapes
+ (:id root)
+ page-id
+ nil
+ variant-id
+ props))]
[root-shape changes]))
(defn generate-add-component
- "If there is exactly one id, and it's a frame (or a group in v1), and not already a component,
- use it as root. Otherwise, create a frame (v2) or group (v1) that contains all ids. Then, make a
+ "If there is exactly one id, and it's a frame, and not already a component,
+ use it as root. Otherwise, create a frame that contains all ids. Then, make a
component with it, and link all shapes to their corresponding one in the component."
- [changes shapes objects page-id file-id components-v2 prepare-create-group prepare-create-board]
+ [changes shapes objects page-id file-id prepare-create-board]
(let [changes (pcb/with-page-id changes page-id)
shapes-count (count shapes)
@@ -1945,9 +1934,7 @@
[root changes old-root-ids]
(if (and (= shapes-count 1)
- (or (and (cfh/group-shape? first-shape)
- (not components-v2))
- (cfh/frame-shape? first-shape))
+ (cfh/frame-shape? first-shape)
(not (ctk/instance-head? first-shape)))
[first-shape
(-> changes
@@ -1962,21 +1949,14 @@
shape-ids (into (d/ordered-set) (map :id) shapes)
[root changes]
- (if-not components-v2
- (prepare-create-group changes ; These functions needs to be passed as argument
- objects ; to avoid a circular dependence
- page-id
- shapes
- root-name
- (not (ctk/instance-head? first-shape)))
- (prepare-create-board changes
- (uuid/next)
- (:parent-id first-shape)
- objects
- shape-ids
- nil
- root-name
- true))]
+ (prepare-create-board changes
+ (uuid/next)
+ (:parent-id first-shape)
+ objects
+ shape-ids
+ nil
+ root-name
+ true)]
[root changes shape-ids]))
@@ -1990,7 +1970,7 @@
objects' (assoc objects (:id root) root)
- [root-shape changes] (generate-add-component-changes changes root objects' file-id page-id components-v2)
+ [root-shape changes] (generate-add-component-changes changes root objects' file-id page-id nil)
changes (pcb/update-shapes changes
old-root-ids
@@ -2004,17 +1984,26 @@
[changes library-data component-id library-id current-page objects]
(let [{:keys [changes shape]} (prepare-restore-component changes library-data component-id current-page)
parent-id (:parent-id shape)
- objects (cond-> (assoc objects (:id shape) shape)
- (not (nil? parent-id))
- (update-in [parent-id :shapes]
- #(conj % (:id shape))))
+
+ insert-before?
+ (and (ctl/flex-layout? objects parent-id)
+ (not (ctl/reverse? objects parent-id)))
+
+ objects
+ (-> objects
+ (assoc (:id shape) shape)
+ (cond-> (and (some? parent-id) insert-before?)
+ (update-in [parent-id :shapes] #(d/concat-vec [(:id shape)] %)))
+ (cond-> (and (some? parent-id) (not insert-before?))
+ (update-in [parent-id :shapes] conj (:id shape))))
;; Adds a resize-parents operation so the groups are updated. We add all the new objects
new-objects-ids (->> changes :redo-changes (filter #(= (:type %) :add-obj)) (mapv :id))
changes (-> changes
(pcb/with-objects objects)
- (pcb/resize-parents new-objects-ids))]
-
+ (pcb/resize-parents new-objects-ids)
+ ;; Fix the order of the children inside the parent
+ (pcb/reorder-children parent-id (get-in objects [parent-id :shapes])))]
(assoc changes :file-id library-id)))
(defn generate-detach-component
@@ -2076,8 +2065,7 @@
[changes objects shape file page libraries id-new-component index target-cell keep-props-values]
(let [[all-parents changes]
(-> changes
- (cls/generate-delete-shapes file page objects (d/ordered-set (:id shape)) {:components-v2 true
- :component-swap true}))
+ (cls/generate-delete-shapes file page objects (d/ordered-set (:id shape)) {:component-swap true}))
[new-shape changes]
(-> changes
(generate-new-shape-for-swap shape file page libraries id-new-component index target-cell keep-props-values))]
@@ -2108,7 +2096,7 @@
(generate-sync-file file-id :typographies asset-id library-id libraries current-file-id))))
(defn generate-sync-head
- [changes file-full libraries container id components-v2 reset?]
+ [changes file-full libraries container id reset?]
(let [shape-inst (ctn/get-shape container id)
objects (:objects container)
parent (get objects (:parent-id shape-inst))
@@ -2117,11 +2105,11 @@
(-> changes
(pcb/with-container container)
(pcb/with-objects (:objects container))
- (generate-sync-shape-direct file-full libraries container (:id head) reset? components-v2))]
+ (generate-sync-shape-direct file-full libraries container (:id head) reset?))]
changes))
(defn generate-reset-component
- [changes file-full libraries container id components-v2]
+ [changes file-full libraries container id]
(let [objects (:objects container)
swap-slot (-> (ctn/get-shape container id)
(ctk/get-swap-slot))
@@ -2129,11 +2117,11 @@
(-> changes
(pcb/with-container container)
(pcb/with-objects objects)
- (generate-sync-shape-direct file-full libraries container id true components-v2))]
+ (generate-sync-shape-direct file-full libraries container id true))]
(cond-> changes
(some? swap-slot)
- (generate-sync-head file-full libraries container id components-v2 true))))
+ (generate-sync-head file-full libraries container id true))))
(defn generate-duplicate-flows
[changes shapes page ids-map]
@@ -2187,52 +2175,90 @@
(pcb/with-page changes page)
frames)))
-(defn generate-duplicate-component-change
- [changes objects page component-root parent-id frame-id delta libraries library-data]
- (let [component-id (:component-id component-root)
- file-id (:component-file component-root)
- main-component (ctf/get-component libraries file-id component-id)
- moved-component (gsh/move component-root delta)
- pos (gpt/point (:x moved-component) (:y moved-component))
- origin-frame (get-in page [:objects frame-id])
- delta (cond-> delta
- (some? origin-frame)
- (gpt/subtract (-> origin-frame :selrect gpt/point)))
+(defn- duplicate-variant
+ [changes library component base-pos parent-id page-id]
+ (let [component-page (ctpl/get-page (:data library) (:main-instance-page component))
+ component-shape (dm/get-in component-page [:objects (:main-instance-id component)])
+ orig-pos (gpt/point (:x component-shape) (:y component-shape))
+ delta (gpt/subtract base-pos orig-pos)
+ new-component-id (uuid/next)
+ [shape changes] (generate-duplicate-component changes
+ library
+ (:id component)
+ new-component-id
+ {:apply-changes-local-library? true
+ :delta delta
+ :new-variant-id parent-id
+ :page-id page-id})]
+ [shape
+ (-> changes
+ (pcb/change-parent parent-id [shape]))]))
+
+
+(defn generate-duplicate-component-change
+ [changes objects page main parent-id frame-id delta libraries library-data ids-map]
+ (let [main-id (:id main)
+ component-id (:component-id main)
+ file-id (:component-file main)
+ component (ctf/get-component libraries file-id component-id)
+ pos (as-> (gsh/move main delta) $
+ (gpt/point (:x $) (:y $)))
+
+ ;; When we duplicate a variant alone, we will instanciate it
+ ;; When we duplicate a variant along with its variant-container, we will duplicate it
+ in-variant-container? (contains? ids-map (:variant-id main))
- instantiate-component
- #(generate-instantiate-component changes
- objects
- file-id
- (:component-id component-root)
- pos
- page
- libraries
- (:id component-root)
- parent-id
- frame-id
- {})
restore-component
- #(let [restore (prepare-restore-component changes library-data (:component-id component-root) page delta (:id component-root) parent-id frame-id)]
- [(:shape restore) (:changes restore)])
+ #(let [{:keys [shape changes]}
+ (prepare-restore-component changes
+ library-data
+ component-id
+ page
+ pos
+ main-id
+ parent-id
+ frame-id)]
+ [shape changes])
[_shape changes]
- (if (nil? main-component)
+ (if (nil? component)
(restore-component)
- (instantiate-component))]
+ (if (and (ctk/is-variant? main) in-variant-container?)
+ (duplicate-variant changes
+ (get libraries file-id)
+ component
+ pos
+ parent-id
+ (:id page))
+
+ (generate-instantiate-component changes
+ objects
+ file-id
+ component-id
+ pos
+ page
+ libraries
+ main-id
+ parent-id
+ frame-id
+ ids-map
+ {})))]
changes))
(defn generate-duplicate-shape-change
- ([changes objects page unames update-unames! ids-map obj delta level-delta libraries library-data file-id]
- (generate-duplicate-shape-change changes objects page unames update-unames! ids-map obj delta level-delta libraries library-data file-id (:frame-id obj) (:parent-id obj) false false true))
+ ([changes objects page unames update-unames! ids ids-map obj delta level-delta libraries library-data file-id]
+ (generate-duplicate-shape-change changes objects page unames update-unames! ids ids-map obj delta level-delta libraries library-data file-id (:frame-id obj) (:parent-id obj) false false true nil))
+ ([changes objects page unames update-unames! ids ids-map obj delta level-delta libraries library-data file-id variant-props]
+ (generate-duplicate-shape-change changes objects page unames update-unames! ids ids-map obj delta level-delta libraries library-data file-id (:frame-id obj) (:parent-id obj) false false true variant-props))
- ([changes objects page unames update-unames! ids-map obj delta level-delta libraries library-data file-id frame-id parent-id duplicating-component? child? remove-swap-slot?]
+ ([changes objects page unames update-unames! ids ids-map obj delta level-delta libraries library-data file-id frame-id parent-id duplicating-component? child? remove-swap-slot? variant-props]
(cond
(nil? obj)
changes
(ctf/is-main-of-known-component? obj libraries)
- (generate-duplicate-component-change changes objects page obj parent-id frame-id delta libraries library-data)
+ (generate-duplicate-component-change changes objects page obj parent-id frame-id delta libraries library-data ids-map)
:else
(let [frame? (cfh/frame-shape? obj)
@@ -2262,8 +2288,7 @@
regenerate-component
(fn [changes shape]
- (let [components-v2 (dm/get-in library-data [:options :components-v2])
- [_ changes] (generate-add-component-changes changes shape objects file-id (:id page) components-v2)]
+ (let [[_ changes] (generate-add-component-changes changes shape objects file-id (:id page) variant-props)]
changes))
new-obj
@@ -2302,7 +2327,14 @@
(d/update-when :interactions #(ctsi/remap-interactions % ids-map objects))
(cond-> (ctl/grid-layout? obj)
- (ctl/remap-grid-cells ids-map)))
+ (ctl/remap-grid-cells ids-map))
+
+ (cond-> (ctk/is-variant-container? parent)
+ (assoc :variant-id parent-id))
+
+ (cond-> (and (ctk/is-variant? obj) (not (ctk/is-variant-container? parent)))
+ (-> (assoc :name (ctv/variant-name-to-name obj))
+ (dissoc :variant-id))))
new-obj (cond-> new-obj
(not duplicating-component?)
@@ -2334,6 +2366,7 @@
page
unames
update-unames!
+ ids
ids-map
child
delta
@@ -2349,21 +2382,22 @@
;; only remove swap slot of children when the current shape
;; is not a subinstance head nor a instance root
(not subinstance-head?)
- (not instance-root?))))
+ (not instance-root?))
+ variant-props))
changes
(map (d/getf objects) (:shapes obj)))))))
(defn generate-duplicate-changes
"Prepare objects to duplicate: generate new id, give them unique names,
move to the desired position, and recalculate parents and frames as needed."
- [changes all-objects page ids delta libraries library-data file-id]
+ [changes all-objects page ids delta libraries library-data file-id & {:keys [variant-props]}]
(let [shapes (map (d/getf all-objects) ids)
unames (volatile! (cfh/get-used-names (:objects page)))
update-unames! (fn [new-name] (vswap! unames conj new-name))
all-ids (reduce #(into %1 (cons %2 (cfh/get-children-ids all-objects %2))) (d/ordered-set) ids)
- ;; We need ids-map for remapping the grid layout. But when duplicating the guides
- ;; we calculate a new one because the components will have created new shapes.
+ ;; We need ids-map for remapping the grid layout. But when duplicating the guides
+ ;; we calculate a new one because the components will have created new shapes.
ids-map (into {} (map #(vector % (uuid/next))) all-ids)
changes (-> changes
@@ -2376,13 +2410,15 @@
page
unames
update-unames!
+ ids
ids-map
%2
delta
nil
libraries
library-data
- file-id)
+ file-id
+ variant-props)
changes))
;; We need to check the changes to get the ids-map
diff --git a/common/src/app/common/logic/shapes.cljc b/common/src/app/common/logic/shapes.cljc
index fa2ba8e5e7..ca64e55f3d 100644
--- a/common/src/app/common/logic/shapes.cljc
+++ b/common/src/app/common/logic/shapes.cljc
@@ -10,14 +10,14 @@
[app.common.files.changes-builder :as pcb]
[app.common.files.helpers :as cfh]
[app.common.geom.shapes :as gsh]
- [app.common.logic.variants :as clv]
+ [app.common.logic.variant-properties :as clvp]
[app.common.types.component :as ctk]
[app.common.types.container :as ctn]
+ [app.common.types.pages-list :as ctpl]
[app.common.types.shape.interactions :as ctsi]
[app.common.types.shape.layout :as ctl]
[app.common.types.token :as cto]
- [app.common.uuid :as uuid]
- [cuerdas.core :as str]))
+ [app.common.uuid :as uuid]))
(defn- generate-unapply-tokens
"When updating attributes that have a token applied, we must unapply it, because the value
@@ -81,163 +81,167 @@
(pcb/update-shapes ids update-fn {:attrs #{:blocked :hidden}}))))
(defn generate-delete-shapes
- [changes file page objects ids {:keys [components-v2 ignore-touched component-swap]}]
- (let [ids (cfh/clean-loops objects ids)
+ ([changes file page objects ids options]
+ (generate-delete-shapes (-> changes
+ (pcb/with-page page)
+ (pcb/with-objects objects)
+ (pcb/with-library-data file))
+ ids
+ options))
+ ([changes ids {:keys [ignore-touched component-swap]}]
+ (let [objects (pcb/get-objects changes)
+ data (pcb/get-library-data changes)
+ page-id (pcb/get-page-id changes)
+ page (or (pcb/get-page changes)
+ (ctpl/get-page data page-id))
- in-component-copy?
- (fn [shape-id]
+ ids (cfh/clean-loops objects ids)
+ in-component-copy?
+ (fn [shape-id]
;; Look for shapes that are inside a component copy, but are
;; not the root. In this case, they must not be deleted,
;; but hidden (to be able to recover them more easily).
;; Unless we are doing a component swap, in which case we want
;; to delete the old shape
- (let [shape (get objects shape-id)]
- (and (ctn/has-any-copy-parent? objects shape)
- (not component-swap))))
+ (let [shape (get objects shape-id)]
+ (and (ctn/has-any-copy-parent? objects shape)
+ (not component-swap))))
- [ids-to-delete ids-to-hide]
- (if components-v2
- (loop [ids-seq (seq ids)
- ids-to-delete []
- ids-to-hide []]
- (let [id (first ids-seq)]
- (if (nil? id)
- [ids-to-delete ids-to-hide]
- (if (in-component-copy? id)
- (recur (rest ids-seq)
- ids-to-delete
- (conj ids-to-hide id))
- (recur (rest ids-seq)
- (conj ids-to-delete id)
- ids-to-hide)))))
- [ids []])
+ [ids-to-delete ids-to-hide]
+ (loop [ids-seq (seq ids)
+ ids-to-delete []
+ ids-to-hide []]
+ (let [id (first ids-seq)]
+ (if (nil? id)
+ [ids-to-delete ids-to-hide]
+ (if (in-component-copy? id)
+ (recur (rest ids-seq)
+ ids-to-delete
+ (conj ids-to-hide id))
+ (recur (rest ids-seq)
+ (conj ids-to-delete id)
+ ids-to-hide)))))
- changes (-> changes
- (pcb/with-page page)
- (pcb/with-objects objects)
- (pcb/with-library-data file))
+ lookup (d/getf objects)
- lookup (d/getf objects)
-
- groups-to-unmask
- (reduce (fn [group-ids id]
+ groups-to-unmask
+ (reduce (fn [group-ids id]
;; When the shape to delete is the mask of a masked group,
;; the mask condition must be removed, and it must be
;; converted to a normal group.
- (let [obj (lookup id)
- parent (lookup (:parent-id obj))]
- (if (and (:masked-group parent)
- (= id (first (:shapes parent))))
- (conj group-ids (:id parent))
- group-ids)))
- #{}
- ids-to-delete)
+ (let [obj (lookup id)
+ parent (lookup (:parent-id obj))]
+ (if (and (:masked-group parent)
+ (= id (first (:shapes parent))))
+ (conj group-ids (:id parent))
+ group-ids)))
+ #{}
+ ids-to-delete)
- interacting-shapes
- (filter (fn [shape]
+ interacting-shapes
+ (filter (fn [shape]
;; If any of the deleted shapes is the destination of
;; some interaction, this must be deleted, too.
- (let [interactions (:interactions shape)]
- (some #(and (ctsi/has-destination %)
- (contains? ids-to-delete (:destination %)))
- interactions)))
- (vals objects))
+ (let [interactions (:interactions shape)]
+ (some #(and (ctsi/has-destination %)
+ (contains? ids-to-delete (:destination %)))
+ interactions)))
+ (vals objects))
- changes
- (reduce (fn [changes {:keys [id] :as flow}]
- (if (contains? ids-to-delete (:starting-frame flow))
- (pcb/set-flow changes id nil)
- changes))
- changes
- (:flows page))
+ changes
+ (reduce (fn [changes {:keys [id] :as flow}]
+ (if (contains? ids-to-delete (:starting-frame flow))
+ (pcb/set-flow changes id nil)
+ changes))
+ changes
+ (:flows page))
- all-parents
- (reduce (fn [res id]
+ all-parents
+ (reduce (fn [res id]
;; All parents of any deleted shape must be resized.
- (into res (cfh/get-parent-ids objects id)))
- (d/ordered-set)
- (concat ids-to-delete ids-to-hide))
+ (into res (cfh/get-parent-ids objects id)))
+ (d/ordered-set)
+ (concat ids-to-delete ids-to-hide))
- all-children
- (->> ids-to-delete ;; Children of deleted shapes must be also deleted.
- (reduce (fn [res id]
- (into res (cfh/get-children-ids objects id)))
- [])
- (reverse)
- (into (d/ordered-set)))
+ all-children
+ (->> ids-to-delete ;; Children of deleted shapes must be also deleted.
+ (reduce (fn [res id]
+ (into res (cfh/get-children-ids objects id)))
+ [])
+ (reverse)
+ (into (d/ordered-set)))
- find-all-empty-parents
- (fn recursive-find-empty-parents [empty-parents]
- (let [all-ids (into empty-parents ids-to-delete)
- contains? (partial contains? all-ids)
- xform (comp (map lookup)
- (filter #(or (cfh/group-shape? %) (cfh/bool-shape? %)))
- (remove #(->> (:shapes %) (remove contains?) seq))
- (map :id))
- parents (into #{} xform all-parents)]
- (if (= empty-parents parents)
- empty-parents
- (recursive-find-empty-parents parents))))
+ find-all-empty-parents
+ (fn recursive-find-empty-parents [empty-parents]
+ (let [all-ids (into empty-parents ids-to-delete)
+ contains? (partial contains? all-ids)
+ xform (comp (map lookup)
+ (filter #(or (cfh/group-shape? %) (cfh/bool-shape? %) (ctk/is-variant-container? %)))
+ (remove #(->> (:shapes %) (remove contains?) seq))
+ (map :id))
+ parents (into #{} xform all-parents)]
+ (if (= empty-parents parents)
+ empty-parents
+ (recursive-find-empty-parents parents))))
- empty-parents
+ empty-parents
;; Any parent whose children are all deleted, must be deleted too.
;; Unless we are during a component swap: in this case we are replacing a shape by
;; other one, so must not delete empty parents.
- (if-not component-swap
- (into (d/ordered-set) (find-all-empty-parents #{}))
- #{})
+ (if-not component-swap
+ (into (d/ordered-set) (find-all-empty-parents #{}))
+ #{})
- components-to-delete
- (if components-v2
- (reduce (fn [components id]
- (let [shape (get objects id)]
- (if (and (= (:component-file shape) (:id file)) ;; Main instances should exist only in local file
- (:main-instance shape)) ;; but check anyway
- (conj components (:component-id shape))
- components)))
- []
- (into ids-to-delete all-children))
- [])
+ components-to-delete
+ (reduce (fn [components id]
+ (let [shape (get objects id)]
+ (if (and (= (:component-file shape) (:id data)) ;; Main instances should exist only in local file
+ (:main-instance shape)) ;; but check anyway
+ (conj components (:component-id shape))
+ components)))
+ []
+ (into ids-to-delete all-children))
- ids-set (set ids-to-delete)
- guides-to-delete
- (->> (:guides page)
- (vals)
- (filter #(contains? ids-set (:frame-id %)))
- (map :id))
+ ids-set (set ids-to-delete)
- changes (reduce (fn [changes guide-id]
- (pcb/set-flow changes guide-id nil))
- changes
- guides-to-delete)
+ guides-to-delete
+ (->> (:guides page)
+ (vals)
+ (filter #(contains? ids-set (:frame-id %)))
+ (map :id))
- changes (reduce (fn [changes component-id]
+ changes (reduce (fn [changes guide-id]
+ (pcb/set-flow changes guide-id nil))
+ changes
+ guides-to-delete)
+
+ changes (reduce (fn [changes component-id]
;; It's important to delete the component before the main instance, because we
;; need to store the instance position if we want to restore it later.
- (pcb/delete-component changes component-id (:id page)))
- changes
- components-to-delete)
+ (pcb/delete-component changes component-id (:id page)))
+ changes
+ components-to-delete)
- changes (-> changes
- (generate-update-shape-flags ids-to-hide objects {:hidden true})
- (pcb/remove-objects all-children {:ignore-touched true})
- (pcb/remove-objects ids-to-delete {:ignore-touched ignore-touched})
- (pcb/remove-objects empty-parents)
- (pcb/resize-parents all-parents)
- (pcb/update-shapes groups-to-unmask
- (fn [shape]
- (assoc shape :masked-group false)))
- (pcb/update-shapes (map :id interacting-shapes)
- (fn [shape]
- (d/update-when shape :interactions
- (fn [interactions]
- (into []
- (remove #(and (ctsi/has-destination %)
- (contains? ids-to-delete (:destination %))))
- interactions))))))]
- [all-parents changes]))
+ changes (-> changes
+ (generate-update-shape-flags ids-to-hide objects {:hidden true})
+ (pcb/remove-objects all-children {:ignore-touched true})
+ (pcb/remove-objects ids-to-delete {:ignore-touched ignore-touched})
+ (pcb/remove-objects empty-parents)
+ (pcb/resize-parents all-parents)
+ (pcb/update-shapes groups-to-unmask
+ (fn [shape]
+ (assoc shape :masked-group false)))
+ (pcb/update-shapes (map :id interacting-shapes)
+ (fn [shape]
+ (d/update-when shape :interactions
+ (fn [interactions]
+ (into []
+ (remove #(and (ctsi/has-destination %)
+ (contains? ids-to-delete (:destination %))))
+ interactions))))))]
+ [all-parents changes])))
(defn generate-relocate
@@ -255,7 +259,7 @@
child-heads-ids (map :id child-heads)
- variant-heads (filter ctk/is-variant? child-heads)
+ variant-shapes (filter ctk/is-variant? shapes)
component-main-parent
(ctn/find-component-main objects parent false)
@@ -339,7 +343,19 @@
(map :id)))
index-cell-data (when to-index (ctl/get-cell-by-index parent to-index))
- cell (or cell (and index-cell-data [(:row index-cell-data) (:column index-cell-data)]))]
+ cell (or cell (and index-cell-data [(:row index-cell-data) (:column index-cell-data)]))
+
+
+ ;; Parents that are a variant-container that becomes empty
+ empty-variant-cont (reduce
+ (fn [to-delete parent-id]
+ (let [parent (get objects parent-id)]
+ (if (and (ctk/is-variant-container? parent)
+ (empty? (remove (set ids) (:shapes parent))))
+ (conj to-delete (:id parent))
+ to-delete)))
+ #{}
+ (remove #(= % parent-id) all-parents))]
(-> changes
;; Remove layout-item properties when moving a shape outside a layout
@@ -368,82 +384,11 @@
;; Remove variant info and rename when moving outside a variant-container
(cond-> (not (ctk/is-variant-container? parent))
- ((fn [changes]
- (reduce
- (fn [changes shape]
- (let [new-name (str/replace (:variant-name shape) #", " " / ")
- [cpath cname] (cfh/parse-path-name new-name)]
- (-> changes
- (pcb/update-component (:component-id shape)
- #(-> (dissoc % :variant-id :variant-properties)
- (assoc :name cname
- :path cpath))
- {:apply-changes-local-library? true})
- (pcb/update-shapes [(:id shape)]
- #(-> (dissoc % :variant-id :variant-name)
- (assoc :name new-name))))))
- changes
- variant-heads))))
+ (clvp/generate-make-shapes-no-variant variant-shapes))
;; Add variant info and rename when moving into a different variant-container
(cond-> (ctk/is-variant-container? parent)
- ((fn [changes]
- (let [get-base-name #(if (some? (:variant-name %))
- (str/replace (:variant-name %) #", " " / ")
- (:name %))
-
- calc-num-props #(-> %
- get-base-name
- cfh/split-path
- count)
-
- max-path-items (apply max (map calc-num-props child-heads))
-
- first-comp-id (->> parent
- :shapes
- first
- (get objects)
- :component-id)
-
- data (pcb/get-library-data changes)
- variant-properties (get-in data [:components first-comp-id :variant-properties])
- num-props (count variant-properties)
- num-new-props (if (< max-path-items num-props)
- 0
- (- max-path-items num-props))
-
- changes (nth
- (iterate #(clv/generate-add-new-property % (:id parent)) changes)
- num-new-props)]
- (reduce
- (fn [changes shape]
- (if (= (:id parent) (:variant-id shape))
- changes ;; do nothing if we aren't changing the parent
- (let [base-name (get-base-name shape)
-
- ;; we need to get the updated library data to have access to the current properties
- data (pcb/get-library-data changes)
-
- props (clv/path-to-properties
- base-name
- (get-in data [:components first-comp-id :variant-properties]))
-
- variant-name (clv/properties-to-name props)
- [cpath cname] (cfh/parse-path-name (:name parent))]
-
- (-> (pcb/update-component changes
- (:component-id shape)
- #(assoc % :variant-id (:id parent)
- :variant-properties props
- :name cname
- :path cpath)
- {:apply-changes-local-library? true})
- (pcb/update-shapes [(:id shape)]
- #(assoc % :variant-id (:id parent)
- :variant-name variant-name
- :name (:name parent)))))))
- changes
- child-heads)))))
+ (clvp/generate-make-shapes-variant child-heads parent))
;; Move the shapes
(pcb/change-parent parent-id
@@ -518,7 +463,11 @@
(pcb/update-shapes ids #(assoc % :blocked true)))
;; Resize parent containers that need to
- (pcb/resize-parents parents))))
+ (pcb/resize-parents parents)
+
+ ;; Remove parents when are a variant-container that becomes empty
+ (cond-> (seq empty-variant-cont)
+ (#(second (generate-delete-shapes % empty-variant-cont {})))))))
(defn change-show-in-viewer
[shape hide?]
diff --git a/common/src/app/common/logic/variant_properties.cljc b/common/src/app/common/logic/variant_properties.cljc
new file mode 100644
index 0000000000..e39e7d223f
--- /dev/null
+++ b/common/src/app/common/logic/variant_properties.cljc
@@ -0,0 +1,198 @@
+;; 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.common.logic.variant-properties
+ (:require
+ [app.common.data :as d]
+ [app.common.files.changes-builder :as pcb]
+ [app.common.files.helpers :as cfh]
+ [app.common.files.variant :as cfv]
+ [app.common.types.component :as ctk]
+ [app.common.types.components-list :as ctcl]
+ [app.common.types.variant :as ctv]
+ [cuerdas.core :as str]))
+
+(defn generate-update-property-name
+ [changes variant-id pos new-name]
+ (let [data (pcb/get-library-data changes)
+ objects (pcb/get-objects changes)
+ related-components (cfv/find-variant-components data objects variant-id)]
+ (reduce (fn [changes component]
+ (pcb/update-component
+ changes (:id component)
+ #(assoc-in % [:variant-properties pos :name] new-name)
+ {:apply-changes-local-library? true}))
+ changes
+ related-components)))
+
+
+(defn generate-remove-property
+ [changes variant-id pos]
+ (let [data (pcb/get-library-data changes)
+ objects (pcb/get-objects changes)
+ related-components (cfv/find-variant-components data objects variant-id)]
+ (reduce (fn [changes component]
+ (let [props (:variant-properties component)
+ props (d/remove-at-index props pos)
+ main-id (:main-instance-id component)
+ name (ctv/properties-to-name props)]
+ (-> changes
+ (pcb/update-component (:id component) #(assoc % :variant-properties props)
+ {:apply-changes-local-library? true})
+ (pcb/update-shapes [main-id] #(assoc % :variant-name name)))))
+ changes
+ related-components)))
+
+
+(defn generate-update-property-value
+ [changes component-id pos value]
+ (let [data (pcb/get-library-data changes)
+ component (ctcl/get-component data component-id true)
+ main-id (:main-instance-id component)
+ name (-> (:variant-properties component)
+ (update pos assoc :value value)
+ ctv/properties-to-name)]
+ (-> changes
+ (pcb/update-component component-id #(assoc-in % [:variant-properties pos :value] value)
+ {:apply-changes-local-library? true})
+ (pcb/update-shapes [main-id] #(assoc % :variant-name name)))))
+
+
+(defn generate-add-new-property
+ [changes variant-id & {:keys [fill-values? property-name]}]
+ (let [data (pcb/get-library-data changes)
+ objects (pcb/get-objects changes)
+ related-components (cfv/find-variant-components data objects variant-id)
+
+ props (-> related-components last :variant-properties)
+ next-prop-num (ctv/next-property-number props)
+ property-name (or property-name (str ctv/property-prefix next-prop-num))
+
+ [_ changes]
+ (reduce (fn [[num changes] component]
+ (let [main-id (:main-instance-id component)
+
+ update-props #(-> (d/nilv % [])
+ (conj {:name property-name
+ :value (if fill-values? (str ctv/value-prefix num) "")}))
+
+ update-name #(if fill-values?
+ (if (str/empty? %)
+ (str ctv/value-prefix num)
+ (str % ", " ctv/value-prefix num))
+ %)]
+ [(inc num)
+ (-> changes
+ (pcb/update-component (:id component)
+ #(update % :variant-properties update-props)
+ {:apply-changes-local-library? true})
+ (pcb/update-shapes [main-id] #(update % :variant-name update-name)))]))
+ [1 changes]
+ related-components)]
+ changes))
+
+(defn- generate-make-shape-no-variant
+ [changes shape]
+ (let [new-name (ctv/variant-name-to-name shape)
+ [cpath cname] (cfh/parse-path-name new-name)]
+ (-> changes
+ (pcb/update-component (:component-id shape)
+ #(-> (dissoc % :variant-id :variant-properties)
+ (assoc :name cname
+ :path cpath))
+ {:apply-changes-local-library? true})
+ (pcb/update-shapes [(:id shape)]
+ #(-> (dissoc % :variant-id :variant-name)
+ (assoc :name new-name))))))
+
+(defn generate-make-shapes-no-variant
+ [changes shapes]
+ (reduce generate-make-shape-no-variant changes shapes))
+
+
+(defn- generate-new-properties-from-variant
+ [shape min-props data container-name base-properties]
+ (let [component (ctcl/get-component data (:component-id shape) true)
+ add-name? (not= (:name component) container-name)
+ props (ctv/merge-properties base-properties
+ (:variant-properties component))
+ new-props (- min-props
+ (+ (count props)
+ (if add-name? 1 0)))
+ props (ctv/add-new-props props (repeat new-props ""))]
+
+ (if add-name?
+ (ctv/add-new-prop props (:name component))
+ props)))
+
+(defn- generate-new-properties-from-non-variant
+ [shape min-props container-name base-properties]
+ (let [;; Remove container name from shape name if present
+ shape-name (ctv/remove-prefix (:name shape) container-name)]
+ (ctv/path-to-properties shape-name base-properties min-props)))
+
+
+(defn generate-make-shapes-variant
+ [changes shapes variant-container]
+ (let [data (pcb/get-library-data changes)
+ objects (pcb/get-objects changes)
+ variant-id (:id variant-container)
+
+ ;; If we are cut-pasting a variant-container, this will be null
+ ;; because it hasn't any shapes yet
+ first-comp-id (->> variant-container
+ :shapes
+ first
+ (get objects)
+ :component-id)
+
+ base-props (->> (get-in data [:components first-comp-id :variant-properties])
+ (map #(assoc % :value "")))
+ num-base-props (count base-props)
+
+ [cpath cname] (cfh/parse-path-name (:name variant-container))
+ container-name (:name variant-container)
+
+ generate-new-properties
+ (fn [shape min-props]
+ (if (ctk/is-variant? shape)
+ (generate-new-properties-from-variant shape min-props data container-name base-props)
+ (generate-new-properties-from-non-variant shape min-props container-name base-props)))
+
+ total-props (reduce (fn [m shape]
+ (max m (count (generate-new-properties shape num-base-props))))
+ 0
+ shapes)
+
+ num-new-props (if (or (zero? num-base-props)
+ (< total-props num-base-props))
+ 0
+ (- total-props num-base-props))
+
+ changes (nth
+ (iterate #(generate-add-new-property % variant-id) changes)
+ num-new-props)
+
+ changes (pcb/update-shapes changes (map :id shapes)
+ #(assoc % :variant-id variant-id
+ :name (:name variant-container)))]
+ (reduce
+ (fn [changes shape]
+ (if (or (zero? num-base-props)
+ (= variant-id (:variant-id shape)))
+ changes ;; do nothing more if we aren't changing the parent or there are no base props
+ (let [props (generate-new-properties shape total-props)
+ variant-name (ctv/properties-to-name props)]
+ (-> (pcb/update-component changes
+ (:component-id shape)
+ #(assoc % :variant-id variant-id
+ :variant-properties props
+ :name cname
+ :path cpath)
+ {:apply-changes-local-library? true})
+ (pcb/update-shapes [(:id shape)]
+ #(assoc % :variant-name variant-name))))))
+ changes
+ shapes)))
\ No newline at end of file
diff --git a/common/src/app/common/logic/variants.cljc b/common/src/app/common/logic/variants.cljc
index c624c757bc..73573d48d3 100644
--- a/common/src/app/common/logic/variants.cljc
+++ b/common/src/app/common/logic/variants.cljc
@@ -1,160 +1,30 @@
-;; 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.common.logic.variants
(:require
- [app.common.data :as d]
- [app.common.data.macros :as dm]
[app.common.files.changes-builder :as pcb]
- [app.common.files.helpers :as cfh]
- [app.common.types.components-list :as ctcl]
- [cuerdas.core :as str]))
+ [app.common.files.variant :as cfv]
+ [app.common.logic.libraries :as cll]
+ [app.common.logic.variant-properties :as clvp]
+ [app.common.types.variant :as ctv]))
+(defn generate-add-new-variant
+ [changes shape variant-id new-component-id new-shape-id prop-num]
+ (let [data (pcb/get-library-data changes)
+ objects (pcb/get-objects changes)
+ component-id (:component-id shape)
+ value (str ctv/value-prefix
+ (-> (cfv/extract-properties-values data objects variant-id)
+ last
+ :value
+ count
+ inc))
-(def property-prefix "Property")
-(def property-regex (re-pattern (str property-prefix "(\\d+)")))
-(def value-prefix "Value")
-
-(defn find-related-components
- "Find a list of the components thet belongs to this variant-id"
- [data objects variant-id]
- (->> (dm/get-in objects [variant-id :shapes])
- (map #(dm/get-in objects [% :component-id]))
- (map #(ctcl/get-component data % true))
- reverse))
-
-
-(defn properties-to-name
- "Transform the properties into a name, with the values separated by comma"
- [properties]
- (->> properties
- (map :value)
- (remove str/empty?)
- (str/join ", ")))
-
-
-(defn next-property-number
- "Returns the next property number, to avoid duplicates on the property names"
- [properties]
- (let [numbers (keep
- #(some->> (:name %) (re-find property-regex) second d/parse-integer)
- properties)
- max-num (if (seq numbers)
- (apply max numbers)
- 0)]
- (inc (max max-num (count properties)))))
-
-
-(defn path-to-properties
- "From a list of properties and a name with path, assign each token of the
- path as value of a different property"
- [path properties]
- (let [next-prop-num (next-property-number properties)
- cpath (cfh/split-path path)
- assigned (mapv #(assoc % :value (nth cpath %2 "")) properties (range))
- remaining (drop (count properties) cpath)
- new-properties (map-indexed (fn [i v] {:name (str property-prefix (+ next-prop-num i))
- :value v}) remaining)]
- (into assigned new-properties)))
-
-(defn- dashes-to-end
- [property-values]
- (let [dashes (if (some #(= % "--") property-values) ["--"] [])]
- (concat (remove #(= % "--") property-values) dashes)))
-
-
-(defn extract-properties-values
- [data objects variant-id]
- (->> (find-related-components data objects variant-id)
- (mapcat :variant-properties)
- (group-by :name)
- (map (fn [[k v]]
- {:name k
- :value (->> v
- (map #(if (str/empty? (:value %)) "--" (:value %)))
- distinct
- dashes-to-end)}))))
-
-
-(defn generate-update-property-name
- [changes variant-id pos new-name]
- (let [data (pcb/get-library-data changes)
- objects (pcb/get-objects changes)
- related-components (find-related-components data objects variant-id)]
- (reduce (fn [changes component]
- (pcb/update-component
- changes (:id component)
- #(assoc-in % [:variant-properties pos :name] new-name)
- {:apply-changes-local-library? true}))
- changes
- related-components)))
-
-
-(defn generate-remove-property
- [changes variant-id pos]
- (let [data (pcb/get-library-data changes)
- objects (pcb/get-objects changes)
- related-components (find-related-components data objects variant-id)]
- (reduce (fn [changes component]
- (let [props (:variant-properties component)
- props (d/remove-at-index props pos)
- main-id (:main-instance-id component)
- name (properties-to-name props)]
- (-> changes
- (pcb/update-component (:id component) #(assoc % :variant-properties props)
- {:apply-changes-local-library? true})
- (pcb/update-shapes [main-id] #(assoc % :variant-name name)))))
- changes
- related-components)))
-
-
-(defn generate-update-property-value
- [changes component-id pos value]
- (let [data (pcb/get-library-data changes)
- component (ctcl/get-component data component-id true)
- main-id (:main-instance-id component)
- name (-> (:variant-properties component)
- (update pos assoc :value value)
- properties-to-name)]
+ [new-shape changes] (-> changes
+ (cll/generate-duplicate-component
+ {:data data}
+ component-id
+ new-component-id
+ {:new-shape-id new-shape-id :apply-changes-local-library? true}))]
(-> changes
- (pcb/update-component component-id #(assoc-in % [:variant-properties pos :value] value)
- {:apply-changes-local-library? true})
- (pcb/update-shapes [main-id] #(assoc % :variant-name name)))))
-
-
-(defn generate-add-new-property
- [changes variant-id & {:keys [fill-values?]}]
- (let [data (pcb/get-library-data changes)
- objects (pcb/get-objects changes)
- related-components (find-related-components data objects variant-id)
-
- props (-> related-components first :variant-properties)
- next-prop-num (next-property-number props)
- property-name (str property-prefix next-prop-num)
-
- [_ changes]
- (reduce (fn [[num changes] component]
- (let [main-id (:main-instance-id component)
-
- update-props #(-> (d/nilv % [])
- (conj {:name property-name
- :value (if fill-values? (str value-prefix num) "")}))
-
- update-name #(if fill-values?
- (if (str/empty? %)
- (str value-prefix num)
- (str % ", " value-prefix num))
- %)]
- [(inc num)
- (-> changes
- (pcb/update-component (:id component)
- #(update % :variant-properties update-props)
- {:apply-changes-local-library? true})
- (pcb/update-shapes [main-id] #(update % :variant-name update-name)))]))
- [1 changes]
- related-components)]
- changes))
-
+ (clvp/generate-update-property-value new-component-id prop-num value)
+ (pcb/change-parent (:parent-id shape) [new-shape] 0))))
diff --git a/common/src/app/common/schema.cljc b/common/src/app/common/schema.cljc
index 64eaa1f9b9..8f68ea051a 100644
--- a/common/src/app/common/schema.cljc
+++ b/common/src/app/common/schema.cljc
@@ -113,6 +113,10 @@
[schema]
(mu/optional-keys schema default-options))
+(defn required-keys
+ [schema]
+ (mu/required-keys schema default-options))
+
(defn transformer
[& transformers]
(apply mt/transformer transformers))
@@ -145,11 +149,30 @@
;; :else
;; o))
+(defn -transform-map-keys
+ ([f]
+ (let [xform (map (fn [[k v]] [(f k) v]))]
+ #(cond->> % (map? %) (into (empty %) xform))))
+ ([ks f]
+ (let [xform (map (fn [[k v]] [(cond-> k (contains? ks k) f) v]))]
+ #(cond->> % (map? %) (into (empty %) xform)))))
+
(defn json-transformer
[]
- (mt/transformer
- (mt/json-transformer)
- (mt/collection-transformer)))
+ (let [map-of-key-decoders (mt/-string-decoders)]
+ (mt/transformer
+ {:name :json
+ :decoders (-> (mt/-json-decoders)
+ (assoc :map-of {:compile (fn [schema _]
+ (let [key-schema (some-> schema (m/children) (first))]
+ (or (some-> key-schema (m/type) map-of-key-decoders
+ (mt/-interceptor schema {}) (m/-intercepting)
+ (m/-comp m/-keyword->string)
+ (mt/-transform-if-valid key-schema)
+ (-transform-map-keys))
+ (-transform-map-keys m/-keyword->string))))}))
+ :encoders (mt/-json-encoders)}
+ (mt/collection-transformer))))
(defn string-transformer
[]
@@ -874,7 +897,7 @@
{:title "inst"
:description "Satisfies Inst protocol"
:error/message "should be an instant"
- :gen/gen (->> (sg/small-int)
+ :gen/gen (->> (sg/small-int :min 0 :max 100000)
(sg/fmap (fn [v] (tm/parse-instant v))))
:decode/string tm/parse-instant
diff --git a/common/src/app/common/svg/path.cljc b/common/src/app/common/svg/path.cljc
index ac89be9d06..5951002a18 100644
--- a/common/src/app/common/svg/path.cljc
+++ b/common/src/app/common/svg/path.cljc
@@ -40,76 +40,3 @@
(map (fn [segment]
(.toPersistentMap ^js segment)))
(parser/parse path-str)))))
-
-#?(:cljs
- (defn content->buffer
- "Converts the path content into binary format."
- [content]
- (let [total (count content)
- ssize 28
- buffer (new js/ArrayBuffer (* total ssize))
- dview (new js/DataView buffer)]
- (loop [index 0]
- (when (< index total)
- (let [segment (nth content index)
- offset (* index ssize)]
- (case (:command segment)
- :move-to
- (let [{:keys [x y]} (:params segment)]
- (.setInt16 dview (+ offset 0) 1)
- (.setFloat32 dview (+ offset 20) x)
- (.setFloat32 dview (+ offset 24) y))
- :line-to
- (let [{:keys [x y]} (:params segment)]
- (.setInt16 dview (+ offset 0) 2)
- (.setFloat32 dview (+ offset 20) x)
- (.setFloat32 dview (+ offset 24) y))
- :curve-to
- (let [{:keys [c1x c1y c2x c2y x y]} (:params segment)]
- (.setInt16 dview (+ offset 0) 3)
- (.setFloat32 dview (+ offset 4) c1x)
- (.setFloat32 dview (+ offset 8) c1y)
- (.setFloat32 dview (+ offset 12) c2x)
- (.setFloat32 dview (+ offset 16) c2y)
- (.setFloat32 dview (+ offset 20) x)
- (.setFloat32 dview (+ offset 24) y))
-
- :close-path
- (.setInt16 dview (+ offset 0) 4))
- (recur (inc index)))))
- buffer)))
-
-#?(:cljs
- (defn buffer->content
- "Converts the a buffer to a path content vector"
- [buffer]
- (assert (instance? js/ArrayBuffer buffer) "expected ArrayBuffer instance")
- (let [ssize 28
- total (/ (.-byteLength buffer) ssize)
- dview (new js/DataView buffer)]
- (loop [index 0
- result []]
- (if (< index total)
- (let [offset (* index ssize)
- type (.getInt16 dview (+ offset 0))
- command (case type
- 1 :move-to
- 2 :line-to
- 3 :curve-to
- 4 :close-path)
- params (case type
- 1 {:x (.getFloat32 dview (+ offset 20))
- :y (.getFloat32 dview (+ offset 24))}
- 2 {:x (.getFloat32 dview (+ offset 20))
- :y (.getFloat32 dview (+ offset 24))}
- 3 {:c1x (.getFloat32 dview (+ offset 4))
- :c1y (.getFloat32 dview (+ offset 8))
- :c2x (.getFloat32 dview (+ offset 12))
- :c2y (.getFloat32 dview (+ offset 16))
- :x (.getFloat32 dview (+ offset 20))
- :y (.getFloat32 dview (+ offset 24))}
- 4 {})]
- (recur (inc index)
- (conj result {:command command
- :params params})))
- result)))))
diff --git a/common/src/app/common/svg/path/bool.cljc b/common/src/app/common/svg/path/bool.cljc
index 11fe314a83..40bb9cc825 100644
--- a/common/src/app/common/svg/path/bool.cljc
+++ b/common/src/app/common/svg/path/bool.cljc
@@ -10,6 +10,7 @@
[app.common.geom.point :as gpt]
[app.common.geom.rect :as grc]
[app.common.geom.shapes.path :as gsp]
+ [app.common.math :as mth]
[app.common.svg.path.command :as upc]
[app.common.svg.path.subpath :as ups]))
@@ -233,6 +234,45 @@
(gsp/command->point current)
(conj result (dissoc current :prev)))))))
+(defn remove-duplicated-segments
+ "Remove from the content segments"
+ [content]
+ (letfn [;; This is a comparator for float points with a precission
+ ;; used to remove already existing segments
+ (comparator [[fx1 fy1 tx1 ty1 :as v1] [fx2 fy2 tx2 ty2 :as v2]]
+ (if (and (mth/close? tx1 tx2)
+ (mth/close? ty1 ty2)
+ (mth/close? fx1 fx2)
+ (mth/close? fy1 fy2))
+ 0 ;; equal
+ (compare v1 v2)))]
+
+ (loop [current (first content)
+ content (rest content)
+ segments (sorted-set-by comparator)
+ result []]
+
+ (if (nil? current)
+ result
+
+ (let [fx (-> current :prev :x)
+ fy (-> current :prev :y)
+ tx (-> current :params :x)
+ ty (-> current :params :y)
+
+ result
+ (cond-> result
+ (and (not (contains? segments [fx fy tx ty]))
+ (not (contains? segments [tx ty fx fy])))
+ (conj current))
+
+ segments (conj segments [fx fy tx ty])]
+
+ (recur (first content)
+ (rest content)
+ segments
+ result))))))
+
(defn create-union [content-a content-a-split content-b content-b-split sr-a sr-b]
;; Pick all segments in content-a that are not inside content-b
;; Pick all segments in content-b that are not inside content-a
@@ -312,15 +352,17 @@
content-a-split (->> content-a-split add-previous (filter is-segment?))
content-b-split (->> content-b-split add-previous (filter is-segment?))
- bool-content
+ content
(case bool-type
:union (create-union content-a content-a-split content-b content-b-split sr-a sr-b)
:difference (create-difference content-a content-a-split content-b content-b-split sr-a sr-b)
:intersection (create-intersection content-a content-a-split content-b content-b-split sr-a sr-b)
:exclude (create-exclusion content-a-split content-b-split))]
- (->> (fix-move-to bool-content)
- (ups/close-subpaths))))
+ (-> content
+ remove-duplicated-segments
+ fix-move-to
+ ups/close-subpaths)))
(defn content-bool
[bool-type contents]
@@ -331,4 +373,3 @@
(reduce (partial content-bool-pair bool-type))
(into []))
[]))
-
diff --git a/common/src/app/common/svg/path/subpath.cljc b/common/src/app/common/svg/path/subpath.cljc
index 2000debb39..d5117f5f84 100644
--- a/common/src/app/common/svg/path/subpath.cljc
+++ b/common/src/app/common/svg/path/subpath.cljc
@@ -126,7 +126,7 @@
(pt= (:from subpath) (:to subpath)))
(defn close-subpaths
- "Searches a path for possible supaths that can create closed loops and merge them"
+ "Searches a path for possible subpaths that can create closed loops and merge them"
[content]
(let [subpaths (get-subpaths content)
closed-subpaths
diff --git a/common/src/app/common/svg/shapes_builder.cljc b/common/src/app/common/svg/shapes_builder.cljc
index 97d738a3bf..90e0889512 100644
--- a/common/src/app/common/svg/shapes_builder.cljc
+++ b/common/src/app/common/svg/shapes_builder.cljc
@@ -435,16 +435,12 @@
attrs
(-> attrs
- (cond-> linecap
- (dissoc :strokeLinecap))
(cond-> (some? color)
(dissoc :stroke :strokeWidth :strokeOpacity))
(update
:style
(fn [style]
(-> style
- (cond-> linecap
- (dissoc :strokeLinecap))
(cond-> (some? color)
(dissoc :stroke :strokeWidth :strokeOpacity)))))
(d/without-nils))]
@@ -461,12 +457,14 @@
(and (some? linecap) (cfh/path-shape? shape)
(or (= linecap :round) (= linecap :square)))
+
(assoc :stroke-cap-start linecap
- :stroke-cap-end linecap)
+ :stroke-cap-end linecap
+ :stroke-linecap linecap)
(d/any-key? (dm/get-in shape [:strokes 0])
:strokeColor :strokeOpacity :strokeWidth
- :strokeCapStart :strokeCapEnd)
+ :strokeLinecap :strokeCapStart :strokeCapEnd)
(assoc-in [:strokes 0 :stroke-style] :svg))))
(defn setup-opacity [shape]
diff --git a/common/src/app/common/test_helpers/components.cljc b/common/src/app/common/test_helpers/components.cljc
index 666406d52b..687be91871 100644
--- a/common/src/app/common/test_helpers/components.cljc
+++ b/common/src/app/common/test_helpers/components.cljc
@@ -31,7 +31,7 @@
"Need that root is already a frame"
(cfh/frame-shape? root))
- (let [[_new-root _new-shapes updated-shapes]
+ (let [[_new-root updated-shapes]
(ctn/convert-shape-in-component root (:objects page) (:id file))
updated-root (first updated-shapes) ; Can't use new-root because it has a new id
@@ -54,8 +54,7 @@
:name name
:path path
:main-instance-id (:id updated-root)
- :main-instance-page (:id page)
- :shapes updated-shapes))))))))
+ :main-instance-page (:id page)))))))))
(defn update-component
[file component-label & {:keys [] :as params}]
@@ -98,7 +97,6 @@
component
(:data library)
(gpt/point 100 100)
- true
{:force-id (thi/new-id! copy-root-label)
:force-frame-id frame-id})
diff --git a/common/src/app/common/test_helpers/compositions.cljc b/common/src/app/common/test_helpers/compositions.cljc
index 82ebf5c58c..2d890844a7 100644
--- a/common/src/app/common/test_helpers/compositions.cljc
+++ b/common/src/app/common/test_helpers/compositions.cljc
@@ -85,7 +85,7 @@
& {:keys [component-params root-params child-params]}]
;; Generated shape tree:
;; {:root-label} [:name Frame1] # [Component :component-label]
- ;; :child-label [:name Rect1]
+ ;; :child-label [:name Rect1]
(-> file
(add-frame-with-child root-label child-label :frame-params root-params :child-params child-params)
(thc/make-component component-label root-label component-params)))
@@ -95,7 +95,7 @@
& {:keys [component-params main-root-params main-child-params copy-root-params]}]
;; Generated shape tree:
;; {:main-root-label} [:name Frame1] # [Component :component-label]
- ;; :main-child-label [:name Rect1]
+ ;; :main-child-label [:name Rect1]
;;
;; :copy-root-label [:name Frame1] #--> [Component :component-label] :main-root-label
;; [:name Rect1] ---> :main-child-label
@@ -113,9 +113,9 @@
& {:keys [component-params root-params child-params-list]}]
;; Generated shape tree:
;; {:root-label} [:name Frame1] # [Component :component-label]
- ;; :child1-label [:name Rect1]
- ;; :child2-label [:name Rect2]
- ;; :child3-label [:name Rect3]
+ ;; :child1-label [:name Rect1]
+ ;; :child2-label [:name Rect2]
+ ;; :child3-label [:name Rect3]
(as-> file $
(add-frame $ root-label root-params)
(reduce (fn [file [index [label params]]]
@@ -134,9 +134,9 @@
& {:keys [component-params main-root-params main-child-params-list copy-root-params]}]
;; Generated shape tree:
;; {:root-label} [:name Frame1] # [Component :component-label]
- ;; :child1-label [:name Rect1]
- ;; :child2-label [:name Rect2]
- ;; :child3-label [:name Rect3]
+ ;; :child1-label [:name Rect1]
+ ;; :child2-label [:name Rect2]
+ ;; :child3-label [:name Rect3]
;;
;; :copy-root-label [:name Frame1] #--> [Component :component-label] :root-label
;; [:name Rect1] ---> :child1-label
@@ -156,7 +156,7 @@
& {:keys [component1-params root1-params main1-child-params component2-params main2-root-params nested-head-params]}]
;; Generated shape tree:
;; {:main1-root-label} [:name Frame1] # [Component :component1-label]
- ;; :main1-child-label [:name Rect1]
+ ;; :main1-child-label [:name Rect1]
;;
;; {:main2-root-label} [:name Frame2] # [Component :component2-label]
;; :nested-head-label [:name Frame1] @--> [Component :component1-label] :main1-root-label
@@ -183,7 +183,7 @@
& {:keys [component1-params root1-params main1-child-params component2-params main2-root-params nested-head-params copy2-root-params]}]
;; Generated shape tree:
;; {:main1-root-label} [:name Frame1] # [Component :component1-label]
- ;; :main1-child-label [:name Rect1]
+ ;; :main1-child-label [:name Rect1]
;;
;; {:main2-root-label} [:name Frame2] # [Component :component2-label]
;; :nested-head-label [:name Frame1] @--> [Component :component1-label] :main1-root-label
@@ -336,8 +336,7 @@
file
{file-id file}
(ctn/make-container container :page)
- (:id shape)
- true))
+ (:id shape)))
file' (thf/apply-changes file changes)]
(if propagate-fn
(propagate-fn file')
@@ -361,7 +360,7 @@
(:objects page)
#{(-> (ths/get-shape file shape-tag :page-label page-label)
:id)}
- {:components-v2 true})
+ {})
file' (thf/apply-changes file changes)]
(if propagate-fn
(propagate-fn file')
@@ -380,7 +379,7 @@
(gpt/point 0 0) ;; delta
{(:id file) file} ;; libraries
(:data file) ;; library-data
- (:id file)) ;; file-id
+ (:id file)) ;; file-id
(cll/generate-duplicate-changes-update-indices (:objects page) ;; objects
#{(:id shape)}))
file' (thf/apply-changes file changes)]
diff --git a/common/src/app/common/test_helpers/variants.cljc b/common/src/app/common/test_helpers/variants.cljc
index 804dd3c7e7..e9a76d0628 100644
--- a/common/src/app/common/test_helpers/variants.cljc
+++ b/common/src/app/common/test_helpers/variants.cljc
@@ -22,4 +22,18 @@
(thc/make-component component1-label root1-label)
(thc/update-component component1-label {:variant-id variant-id :variant-properties [{:name "Property1" :value "Value1"}]})
(thc/make-component component2-label root2-label)
- (thc/update-component component2-label {:variant-id variant-id :variant-properties [{:name "Property1" :value "Value1"}]}))))
+ (thc/update-component component2-label {:variant-id variant-id :variant-properties [{:name "Property1" :value "Value2"}]}))))
+
+(defn add-variant-two-properties
+ [file variant-label component1-label root1-label component2-label root2-label
+ & {:keys []}]
+ (let [file (ths/add-sample-shape file variant-label :type :frame :is-variant-container true)
+ variant-id (thi/id variant-label)]
+
+ (-> file
+ (ths/add-sample-shape root2-label :type :frame :parent-label variant-label :variant-id variant-id :variant-name "p1v2, p2v2")
+ (ths/add-sample-shape root1-label :type :frame :parent-label variant-label :variant-id variant-id :variant-name "p1v1, p2v1")
+ (thc/make-component component1-label root1-label)
+ (thc/update-component component1-label {:variant-id variant-id :variant-properties [{:name "Property1" :value "p1v1"} {:name "Property2" :value "p2v1"}]})
+ (thc/make-component component2-label root2-label)
+ (thc/update-component component2-label {:variant-id variant-id :variant-properties [{:name "Property1" :value "p1v2"} {:name "Property2" :value "p2v2"}]}))))
diff --git a/common/src/app/common/types/component.cljc b/common/src/app/common/types/component.cljc
index 14844153e9..09aa6b6f17 100644
--- a/common/src/app/common/types/component.cljc
+++ b/common/src/app/common/types/component.cljc
@@ -10,6 +10,7 @@
[app.common.schema :as sm]
[app.common.types.page :as ctp]
[app.common.types.plugins :as ctpg]
+ [app.common.types.variant :as ctv]
[cuerdas.core :as str]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
@@ -17,15 +18,17 @@
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(def schema:component
- [:map
- [:id ::sm/uuid]
- [:name :string]
- [:path {:optional true} [:maybe :string]]
- [:modified-at {:optional true} ::sm/inst]
- [:objects {:gen/max 10 :optional true} ::ctp/objects]
- [:main-instance-id ::sm/uuid]
- [:main-instance-page ::sm/uuid]
- [:plugin-data {:optional true} ::ctpg/plugin-data]])
+ [:merge
+ [:map
+ [:id ::sm/uuid]
+ [:name :string]
+ [:path {:optional true} [:maybe :string]]
+ [:modified-at {:optional true} ::sm/inst]
+ [:objects {:gen/max 10 :optional true} ::ctp/objects]
+ [:main-instance-id ::sm/uuid]
+ [:main-instance-page ::sm/uuid]
+ [:plugin-data {:optional true} ::ctpg/plugin-data]]
+ ::ctv/variant-component])
(sm/register! ::component schema:component)
@@ -90,8 +93,8 @@
:constraints-h :constraints-group
:constraints-v :constraints-group
:fixed-scroll :constraints-group
- :bool-type :bool-group
- :bool-content :bool-group
+ :bool-type :content-group
+ :bool-content :content-group
:exports :exports-group
:grids :grids-group
@@ -179,10 +182,8 @@
(= (:component-file shape) file-id)))
(defn is-main-of?
- [shape-main shape-inst components-v2]
- (or (= (:shape-ref shape-inst) (:id shape-main))
- (and (= (:shape-ref shape-inst) (:shape-ref shape-main))
- (not components-v2))))
+ [shape-main shape-inst]
+ (= (:shape-ref shape-inst) (:id shape-main)))
(defn main-instance?
"Check if this shape is the root of the main instance of some
@@ -333,8 +334,6 @@
(let [parent (get objects (:parent-id shape))]
;; We don't want to change the structure of component copies
(and (not (in-component-copy-not-head? shape))
- ;; We don't want to duplicate variants
- (not (is-variant? shape))
;; Non instance, non copy. We allow
(or (not (instance-head? shape))
(not (in-component-copy? parent))))))
diff --git a/common/src/app/common/types/components_list.cljc b/common/src/app/common/types/components_list.cljc
index 1139a6a66b..fd75341681 100644
--- a/common/src/app/common/types/components_list.cljc
+++ b/common/src/app/common/types/components_list.cljc
@@ -34,20 +34,12 @@
(assoc component :modified-at (dt/now)))
(defn add-component
- [fdata {:keys [id name path main-instance-id main-instance-page shapes annotation variant-id variant-properties]}]
- (let [components-v2 (dm/get-in fdata [:options :components-v2])
- fdata (update fdata :components assoc id (touch {:id id :name name :path path}))]
- (if components-v2
- (cond-> (update-in fdata [:components id] assoc :main-instance-id main-instance-id :main-instance-page main-instance-page)
- annotation (update-in [:components id] assoc :annotation annotation)
- variant-id (update-in [:components id] assoc :variant-id variant-id)
- variant-properties (update-in [:components id] assoc :variant-properties variant-properties))
-
- (let [wrap-object-fn cfeat/*wrap-with-objects-map-fn*]
- (assoc-in fdata [:components id :objects]
- (->> shapes
- (d/index-by :id)
- (wrap-object-fn)))))))
+ [fdata {:keys [id name path main-instance-id main-instance-page annotation variant-id variant-properties]}]
+ (let [fdata (update fdata :components assoc id (touch {:id id :name name :path path}))]
+ (cond-> (update-in fdata [:components id] assoc :main-instance-id main-instance-id :main-instance-page main-instance-page)
+ annotation (update-in [:components id] assoc :annotation annotation)
+ variant-id (update-in [:components id] assoc :variant-id variant-id)
+ variant-properties (update-in [:components id] assoc :variant-properties variant-properties))))
(defn mod-component
[file-data {:keys [id name path main-instance-id main-instance-page objects annotation variant-id variant-properties modified-at]}]
@@ -119,7 +111,6 @@
[file-data component-id f & args]
(d/update-in-when file-data [:components component-id] #(-> (apply f % args)
(touch))))
-
(defn set-component-modified
[file-data component-id]
(update-component file-data component-id identity))
diff --git a/common/src/app/common/types/container.cljc b/common/src/app/common/types/container.cljc
index 6b714fb465..bfb6d09e2e 100644
--- a/common/src/app/common/types/container.cljc
+++ b/common/src/app/common/types/container.cljc
@@ -267,67 +267,8 @@
new-children (->> (cfh/get-children objects (:id root))
(map #(dissoc % :component-root)))]
[(assoc new-root :id new-id)
- nil
(into [new-root] new-children)]))
-(defn make-component-shape ;; Only used for components v1
- "Clone the shape and all children. Generate new ids and detach
- from parent and frame. Update the original shapes to have links
- to the new ones."
- [shape objects file-id components-v2]
- (assert (nil? (:component-id shape)))
- (assert (nil? (:component-file shape)))
- (assert (nil? (:shape-ref shape)))
- (let [frame-ids-map (volatile! {})
-
- ;; Ensure that the component root is not an instance
- update-new-shape (fn [new-shape original-shape]
- (when (= (:type original-shape) :frame)
- (vswap! frame-ids-map assoc (:id original-shape) (:id new-shape)))
-
- (cond-> new-shape
- true
- (dissoc :component-root)
-
- (nil? (:parent-id new-shape))
- (dissoc :component-id
- :component-file
- :shape-ref)))
-
- ;; Make the original shape an instance of the new component.
- ;; If one of the original shape children already was a component
- ;; instance, maintain this instanceness untouched.
- update-original-shape (fn [original-shape new-shape]
- (cond-> original-shape
- (nil? (:shape-ref original-shape))
- (-> (assoc :shape-ref (:id new-shape))
- (dissoc :touched))
-
- (nil? (:parent-id new-shape))
- (assoc :component-id (:id new-shape)
- :component-file file-id
- :component-root true)
-
- (and (nil? (:parent-id new-shape)) components-v2)
- (assoc :main-instance true)
-
- (some? (:parent-id new-shape))
- (dissoc :component-root)))
-
- [new-root-shape new-shapes updated-shapes]
- (ctst/clone-shape shape
- nil
- objects
- :update-new-shape update-new-shape
- :update-original-shape update-original-shape)
-
- ;; If frame-id points to a shape inside the component, remap it to the
- ;; corresponding new frame shape. If not, set it to nil.
- remap-frame-id (fn [shape]
- (update shape :frame-id #(get @frame-ids-map % nil)))]
-
- [new-root-shape (map remap-frame-id new-shapes) updated-shapes]))
-
(defn remove-swap-keep-attrs
"Remove flex children properties except the fit-content for flex layouts. These are properties
that we don't have to propagate to copies but will be respected when swapping components"
@@ -352,20 +293,18 @@
WARNING: This process does not remap media references (on fills, strokes, ...); that is
delegated to an async process on the backend side that checks unreferenced shapes and
automatically creates correct references."
- ([page component library-data position components-v2]
- (make-component-instance page component library-data position components-v2 {}))
- ([page component library-data position components-v2
+ ([page component library-data position]
+ (make-component-instance page component library-data position {}))
+ ([page component library-data position
{:keys [main-instance? force-id force-frame-id keep-ids?]
:or {main-instance? false force-id nil force-frame-id nil keep-ids? false}}]
- (let [component-page (when components-v2
- (ctpl/get-page library-data (:main-instance-page component)))
+ (let [component-page (ctpl/get-page library-data (:main-instance-page component))
+
+ component-shape (-> (get-shape component-page (:main-instance-id component))
+ (assoc :parent-id nil) ;; On v2 we force parent-id to nil in order to behave like v1
+ (assoc :frame-id uuid/zero)
+ (remove-swap-keep-attrs))
- component-shape (if components-v2
- (-> (get-shape component-page (:main-instance-id component))
- (assoc :parent-id nil) ;; On v2 we force parent-id to nil in order to behave like v1
- (assoc :frame-id uuid/zero)
- (remove-swap-keep-attrs))
- (get-shape component (:id component)))
orig-pos (gpt/point (:x component-shape) (:y component-shape))
delta (gpt/subtract position orig-pos)
@@ -395,8 +334,7 @@
update-new-shape
(fn [new-shape original-shape]
(let [new-name (:name new-shape)
- root? (or (ctk/instance-root? original-shape) ; If shape is inside a component (not components-v2)
- (nil? (:parent-id original-shape)))] ; we detect it by having no parent)
+ root? (ctk/instance-root? original-shape)]
(when root?
(vswap! unames conj new-name))
@@ -417,10 +355,8 @@
main-instance?
(dissoc :shape-ref)
- (and (not main-instance?)
- (or components-v2 ; In v1, shape-ref points to the remote instance
- (nil? (:shape-ref original-shape)))) ; in v2, shape-ref points to the near instance
- (assoc :shape-ref (:id original-shape))
+ (not main-instance?)
+ (assoc :shape-ref (:id original-shape)) ; shape-ref points to the near instance
(nil? (:parent-id original-shape))
(assoc :component-id (:id component)
@@ -428,14 +364,14 @@
:component-root true
:name new-name)
- (or (some? (:parent-id original-shape)) ; On v2 we have removed the parent-id for component roots (see above)
+ (or (some? (:parent-id original-shape)) ; On v2 we have removed the parent-id for component roots
(some? component-frame))
(dissoc :component-root))))
[new-shape new-shapes _]
(ctst/clone-shape component-shape
frame-id
- (if components-v2 (:objects component-page) (:objects component))
+ (:objects component-page)
:update-new-shape update-new-shape
:force-id force-id
:keep-ids? keep-ids?
@@ -545,21 +481,39 @@
no-changes?
(and (every? #(= parent-id (:parent-id %)) children)
(not pasting?))
+
+ ;; When pasting frames, children have the frames and their children
+ ;; We need to check only the top shapes
+ children-ids (set (map :id children))
+ top-children (remove #(contains? children-ids (:parent-id %)) children)
+
+ ;; Are all the top-children a main-instance of a component?
all-main?
- (every? ctk/main-instance? children)
+ (every? ctk/main-instance? top-children)
any-main-descendant
(some
(fn [shape]
(some ctk/main-instance? (cfh/get-children-with-self objects (:id shape))))
- children)]
+ children)
+ ;; Are all the top-children a main-instance of a cutted component?
+ all-comp-cut?
+ (when all-main?
+ (->> top-children
+ (map #(ctkl/get-component (dm/get-in libraries [(:component-file %) :data])
+ (:component-id %)
+ true))
+ (every? :deleted)))]
(if (or no-changes?
(and (not (invalid-structure-for-component? objects parent children pasting? libraries))
- ;; If we are moving into a variant-container, all the items should be main
- (or all-main? (not (ctk/is-variant-container? parent)))
;; If we are moving into a main component, no descendant can be main
- (or (nil? any-main-descendant) (not (ctk/main-instance? parent)))))
+ (or (nil? any-main-descendant) (not (ctk/main-instance? parent)))
+ ;; If we are moving into a variant-container, all the items should be main
+ ;; so if we are pasting, only allow main instances that are cut-and-pasted
+ (or (not (ctk/is-variant-container? parent))
+ (and (not pasting?) all-main?)
+ all-comp-cut?)))
[parent-id (get-frame parent-id)]
(recur (:parent-id parent) objects children pasting? libraries))))))
@@ -602,8 +556,7 @@
;; TODO: the check of :width and :height probably may be
;; removed after the check added in
- ;; data/workspace/modifiers/check-delta function. Better check
- ;; it and test toroughly when activating components-v2 mode.
+ ;; data/workspace/modifiers/check-delta function.
in-copy?
(ctk/in-component-copy? shape)
diff --git a/common/src/app/common/types/file.cljc b/common/src/app/common/types/file.cljc
index c6f029ac57..dbe637f457 100644
--- a/common/src/app/common/types/file.cljc
+++ b/common/src/app/common/types/file.cljc
@@ -130,7 +130,7 @@
(some? page-id)
(ctpl/add-page page)
- (contains? cfeat/*current* "components/v2")
+ :always
(assoc-in [:options :components-v2] true)))))
(defn make-file
@@ -221,48 +221,45 @@
(ctpl/get-page file-data (:main-instance-page component)))
(defn get-component-container
- "Retrieve the container that holds the component shapes (the page in components-v2
- or the component itself in v1 or deleted component)."
+ "Retrieve the container that holds the component shapes (the page
+ or the component itself on deleted component)."
[file-data component]
- (let [components-v2 (dm/get-in file-data [:options :components-v2])]
- (if (and components-v2 (not (:deleted component)))
- (let [component-page (get-component-page file-data component)]
- (cfh/make-container component-page :page))
- (cfh/make-container component :component))))
+ (if (not (:deleted component))
+ (let [component-page (get-component-page file-data component)]
+ (cfh/make-container component-page :page))
+ (cfh/make-container component :component)))
(defn get-component-root
"Retrieve the root shape of the component."
[file-data component]
- (let [components-v2 (dm/get-in file-data [:options :components-v2])]
- (if (and components-v2 (not (:deleted component)))
- (-> file-data
- (get-component-page component)
- (ctn/get-shape (:main-instance-id component)))
- (ctk/get-component-root component))))
+ (if (not (:deleted component))
+ (-> file-data
+ (get-component-page component)
+ (ctn/get-shape (:main-instance-id component)))
+ (ctk/get-component-root component)))
(defn get-component-shape
"Retrieve one shape in the component by id. If with-context? is true, add the
file and container where the shape resides in its metadata."
[file-data component shape-id & {:keys [with-context?] :or {with-context? false}}]
- (let [components-v2 (dm/get-in file-data [:options :components-v2])]
- (if (and components-v2 (not (:deleted component)))
- (let [component-page (get-component-page file-data component)]
- (when component-page
- (let [child (cfh/get-child (:objects component-page)
- (:main-instance-id component)
- shape-id)]
- (cond-> child
- (and child with-context?)
- (with-meta {:file {:id (:id file-data)
- :data file-data}
- :container (ctn/make-container component-page :page)})))))
+ (if (not (:deleted component))
+ (let [component-page (get-component-page file-data component)]
+ (when component-page
+ (let [child (cfh/get-child (:objects component-page)
+ (:main-instance-id component)
+ shape-id)]
+ (cond-> child
+ (and child with-context?)
+ (with-meta {:file {:id (:id file-data)
+ :data file-data}
+ :container (ctn/make-container component-page :page)})))))
- (let [shape (dm/get-in component [:objects shape-id])]
- (cond-> shape
- (and shape with-context?)
- (with-meta {:file {:id (:id file-data)
- :data file-data}
- :container (ctn/make-container component :component)}))))))
+ (let [shape (dm/get-in component [:objects shape-id])]
+ (cond-> shape
+ (and shape with-context?)
+ (with-meta {:file {:id (:id file-data)
+ :data file-data}
+ :container (ctn/make-container component :component)})))))
(defn get-ref-shape
"Retrieve the shape in the component that is referenced by the instance shape."
@@ -384,12 +381,11 @@
(defn get-component-shapes
"Retrieve all shapes of the component"
[file-data component]
- (let [components-v2 (dm/get-in file-data [:options :components-v2])]
- (if (and components-v2
- (not (:deleted component))) ;; the deleted components have its children in the :objects property
- (let [instance-page (get-component-page file-data component)]
- (cfh/get-children-with-self (:objects instance-page) (:main-instance-id component)))
- (vals (:objects component)))))
+
+ (if (not (:deleted component)) ;; the deleted components have its children in the :objects property
+ (let [instance-page (get-component-page file-data component)]
+ (cfh/get-children-with-self (:objects instance-page) (:main-instance-id component)))
+ (vals (:objects component))))
;; Return true if the object is a component that exists on the file or its libraries (even a deleted one)
(defn is-main-of-known-component?
@@ -403,44 +399,52 @@
(defn load-component-objects
"Add an :objects property to the component, with only the shapes that belong to it"
- [file-data component]
- (let [components-v2 (dm/get-in file-data [:options :components-v2])]
- (if (and components-v2 component (empty? (:objects component))) ;; This operation may be called twice, e.g. in an idempotent change
- (let [component-page (get-component-page file-data component)
- page-objects (:objects component-page)
- objects (->> (cons (:main-instance-id component)
- (cfh/get-children-ids page-objects (:main-instance-id component)))
- (map #(get page-objects %))
- (d/index-by :id))]
- (assoc component :objects objects))
- component)))
+ ([file-data component]
+ (load-component-objects file-data component (gpt/point 0 0)))
+ ([file-data component delta]
+ (if (and component (empty? (:objects component))) ;; This operation may be called twice, e.g. in an idempotent change
+ (let [component-page (get-component-page file-data component)
+ page-objects (:objects component-page)
+ objects (->> (cons (:main-instance-id component)
+ (cfh/get-children-ids page-objects (:main-instance-id component)))
+ (map #(get page-objects %))
+ ;; when it is an undo of a cut-paste, we need to undo the movement
+ ;; of the shapes so we need to move them delta
+ (map #(gsh/move % delta))
+ (d/index-by :id))]
+ (assoc component :objects objects))
+ component)))
(defn delete-component
"Mark a component as deleted and store the main instance shapes iside it, to
be able to be recovered later."
- [file-data component-id skip-undelete? main-instance]
- (let [components-v2 (dm/get-in file-data [:options :components-v2])]
- (if (or (not components-v2) skip-undelete?)
+ [file-data component-id skip-undelete? delta]
+ (let [delta (or delta (gpt/point 0 0))]
+ (if skip-undelete?
(ctkl/delete-component file-data component-id)
- (let [set-main-instance ;; If there is a saved main-instance, restore it. This happens on the restore-component action
- #(if main-instance
- (assoc-in % [:objects (:main-instance-id %)] main-instance)
- %)]
- (-> file-data
- (ctkl/update-component component-id (partial load-component-objects file-data))
- (ctkl/update-component component-id set-main-instance)
- (ctkl/mark-component-deleted component-id))))))
+ (-> file-data
+ (ctkl/update-component component-id #(load-component-objects file-data % delta))
+ (ctkl/mark-component-deleted component-id)))))
(defn restore-component
"Recover a deleted component and all its shapes and put all this again in place."
[file-data component-id page-id]
- (let [components-v2 (dm/get-in file-data [:options :components-v2])
- update-page? (and components-v2 (not (nil? page-id)))]
- (-> file-data
- (ctkl/update-component component-id #(dissoc % :objects))
- (ctkl/mark-component-undeleted component-id)
- (cond-> update-page?
- (ctkl/update-component component-id #(assoc % :main-instance-page page-id))))))
+ (let [update-page? (not (nil? page-id))
+ component (ctkl/get-component file-data component-id true)
+ main-instance-page (or page-id (:main-instance-page component))
+ main-instance (dm/get-in file-data [:pages-index main-instance-page
+ :objects (:main-instance-id component)])]
+ (cond-> file-data
+ :always
+ (->
+ (ctkl/update-component component-id #(dissoc % :objects))
+ (ctkl/mark-component-undeleted component-id))
+
+ update-page?
+ (ctkl/update-component component-id #(assoc % :main-instance-page page-id))
+
+ (ctk/is-variant? component)
+ (ctkl/update-component component-id #(assoc % :variant-id (:variant-id main-instance))))))
(defn purge-component
"Remove permanently a component."
@@ -557,7 +561,6 @@
component
library-data
position
- (dm/get-in file-data [:options :components-v2])
{:main-instance? true
:keep-ids? true})
@@ -589,8 +592,7 @@
:name (:name component)
:path (:path component)
:main-instance-id (:id main-instance-shape)
- :main-instance-page page-id
- :shapes (get-component-shapes library-data component)}))
+ :main-instance-page page-id}))
; Change all existing instances to point to the local file
remap-instances
diff --git a/common/src/app/common/types/shape.cljc b/common/src/app/common/types/shape.cljc
index fc70ff61e1..b7d50a1c16 100644
--- a/common/src/app/common/types/shape.cljc
+++ b/common/src/app/common/types/shape.cljc
@@ -32,6 +32,7 @@
[app.common.types.shape.shadow :as ctss]
[app.common.types.shape.text :as ctsx]
[app.common.types.token :as cto]
+ [app.common.types.variant :as ctv]
[app.common.uuid :as uuid]
[clojure.set :as set]))
@@ -233,7 +234,7 @@
[:map {:title "BoolAttrs"}
[:shapes [:vector {:gen/max 10 :gen/min 1} ::sm/uuid]]
[:bool-type [::sm/one-of bool-types]]
- [:bool-content ::ctsp/content]])
+ [:content ::ctsp/content]])
(def ^:private schema:rect-attrs
[:map {:title "RectAttrs"}])
@@ -317,7 +318,9 @@
schema:frame-attrs
schema:shape-attrs
schema:shape-geom-attrs
- schema:shape-base-attrs]]
+ schema:shape-base-attrs
+ ::ctv/variant-shape
+ ::ctv/variant-container]]
[:bool
[:merge {:title "BoolShape"}
diff --git a/common/src/app/common/types/shape/path.cljc b/common/src/app/common/types/shape/path.cljc
index 1fd33bd45c..8e102c7e0f 100644
--- a/common/src/app/common/types/shape/path.cljc
+++ b/common/src/app/common/types/shape/path.cljc
@@ -6,7 +6,16 @@
(ns app.common.types.shape.path
(:require
- [app.common.schema :as sm]))
+ [app.common.schema :as sm])
+ (:import
+ #?(:cljs [goog.string StringBuffer]
+ :clj [java.nio ByteBuffer])))
+
+#?(:clj (set! *warn-on-reflection* true))
+
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+;; SCHEMA: PLAIN FORMAT
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(def schema:line-to-segment
[:map
@@ -52,5 +61,371 @@
(def schema:path-content
[:vector schema:path-segment])
+(def check-path-content
+ (sm/check-fn schema:path-content))
+
(sm/register! ::segment schema:path-segment)
(sm/register! ::content schema:path-content)
+
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+;; TYPE: PATH-DATA
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+
+(def ^:const SEGMENT-BYTE-SIZE 28)
+
+(defprotocol IPathData
+ (-write-to [_ buffer offset] "write the content to the specified buffer"))
+
+(defrecord PathSegment [command params])
+
+(defn- get-path-string
+ "Format the path data structure to string"
+ [buffer size]
+ (let [builder #?(:clj (java.lang.StringBuilder. (int (* size 4)))
+ :cljs (StringBuffer.))]
+ (loop [index 0]
+ (when (< index size)
+ (let [offset (* index SEGMENT-BYTE-SIZE)
+ type #?(:clj (.getShort ^ByteBuffer buffer offset)
+ :cljs (.getInt16 buffer offset))]
+ (case (long type)
+ 1 (let [x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 20))
+ :cljs (.getFloat32 buffer (+ offset 20)))
+ y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 24))
+ :cljs (.getFloat32 buffer (+ offset 24)))]
+ (doto builder
+ (.append "M")
+ (.append x)
+ (.append ",")
+ (.append y)))
+ 2 (let [x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 20))
+ :cljs (.getFloat32 buffer (+ offset 20)))
+ y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 24))
+ :cljs (.getFloat32 buffer (+ offset 24)))]
+ (doto builder
+ (.append "L")
+ (.append x)
+ (.append ",")
+ (.append y)))
+
+ 3 (let [c1x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 4))
+ :cljs (.getFloat32 buffer (+ offset 4)))
+ c1y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 8))
+ :cljs (.getFloat32 buffer (+ offset 8)))
+ c2x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 12))
+ :cljs (.getFloat32 buffer (+ offset 12)))
+ c2y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 16))
+ :cljs (.getFloat32 buffer (+ offset 16)))
+ x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 20))
+ :cljs (.getFloat32 buffer (+ offset 20)))
+ y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 24))
+ :cljs (.getFloat32 buffer (+ offset 24)))]
+ (doto builder
+ (.append "C")
+ (.append c1x)
+ (.append ",")
+ (.append c1y)
+ (.append ",")
+ (.append c2x)
+ (.append ",")
+ (.append c2y)
+ (.append ",")
+ (.append x)
+ (.append ",")
+ (.append y)))
+ 4 (doto builder
+ (.append "Z")))
+ (recur (inc index)))))
+
+ (.toString builder)))
+
+(defn- read-segment
+ [buffer index]
+ (let [offset (* index SEGMENT-BYTE-SIZE)
+ type #?(:clj (.getShort ^ByteBuffer buffer offset)
+ :cljs (.getInt16 buffer offset))]
+ (case (long type)
+ 1 (let [x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 20))
+ :cljs (.getFloat32 buffer (+ offset 20)))
+ y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 24))
+ :cljs (.getFloat32 buffer (+ offset 24)))]
+ (->PathSegment :move-to {:x x :y y}))
+
+ 2 (let [x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 20))
+ :cljs (.getFloat32 buffer (+ offset 20)))
+ y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 24))
+ :cljs (.getFloat32 buffer (+ offset 24)))]
+ (->PathSegment :line-to {:x x :y y}))
+
+ 3 (let [c1x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 4))
+ :cljs (.getFloat32 buffer (+ offset 4)))
+ c1y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 8))
+ :cljs (.getFloat32 buffer (+ offset 8)))
+ c2x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 12))
+ :cljs (.getFloat32 buffer (+ offset 12)))
+ c2y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 16))
+ :cljs (.getFloat32 buffer (+ offset 16)))
+ x #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 20))
+ :cljs (.getFloat32 buffer (+ offset 20)))
+ y #?(:clj (.getFloat ^ByteBuffer buffer (+ offset 24))
+ :cljs (.getFloat32 buffer (+ offset 24)))]
+
+ (->PathSegment :curve-to {:x x :y y :c1x c1x :c1y c1y :c2x c2x :c2y c2y}))
+
+ 4 (->PathSegment :close-path {}))))
+
+(defn- in-range?
+ [size i]
+ (and (< i size) (>= i 0)))
+
+#?(:clj
+ (deftype PathData [size buffer]
+ Object
+ (toString [_]
+ (get-path-string buffer size))
+
+ clojure.lang.Sequential
+ clojure.lang.IPersistentCollection
+
+ (empty [_]
+ (throw (ex-info "not implemented" {})))
+ (equiv [_ other]
+ (if (instance? PathData other)
+ (.equals ^ByteBuffer buffer (.-buffer ^PathData other))
+ false))
+
+ (seq [this]
+ (when (pos? size)
+ (->> (range size)
+ (map (fn [i] (nth this i))))))
+
+ (cons [_ _val]
+ (throw (ex-info "not implemented" {})))
+
+ clojure.lang.IReduceInit
+ (reduce [_ f start]
+ (loop [index 0
+ result start]
+ (if (< index size)
+ (let [result (f result (read-segment buffer index))]
+ (if (reduced? result)
+ @result
+ (recur (inc index) result)))
+ result)))
+
+ clojure.lang.Indexed
+ (nth [_ i]
+ (if (in-range? size i)
+ (read-segment buffer i)
+ nil))
+
+ (nth [_ i default]
+ (if (in-range? size i)
+ (read-segment buffer i)
+ default))
+
+ clojure.lang.Counted
+ (count [_] size))
+
+ :cljs
+ (deftype PathData [size buffer dview]
+ Object
+ (toString [_]
+ (get-path-string dview size))
+
+ IPathData
+ (-write-to [_ into-buffer offset]
+ (assert (instance? js/ArrayBuffer into-buffer) "expected an instance of Uint32Array")
+ (let [size (.-byteLength buffer)
+ mem (js/Uint32Array. into-buffer offset size)]
+ (.set mem (js/Uint32Array. buffer))))
+
+ cljs.core/ISequential
+ cljs.core/IEquiv
+ (-equiv [_ other]
+ (if (instance? PathData other)
+ (let [obuffer (.-buffer other)
+ osize (.-byteLength obuffer)
+ csize (.-byteLength buffer)]
+ (if (= osize csize)
+ (let [cb (js/Uint32Array. buffer)
+ ob (js/Uint32Array. obuffer)]
+ (loop [i 0]
+ (if (< i osize)
+ (if (= (aget ob i)
+ (aget cb i))
+ (recur (inc i))
+ false)
+ true)))
+ false))
+ false))
+
+ cljs.core/IReduce
+ (-reduce [_ f]
+ (loop [index 1
+ result (if (pos? size)
+ (read-segment dview 0)
+ nil)]
+ (if (< index size)
+ (let [result (f result (read-segment dview index))]
+ (if (reduced? result)
+ @result
+ (recur (inc index) result)))
+ result)))
+
+ (-reduce [_ f start]
+ (loop [index 0
+ result start]
+ (if (< index size)
+ (let [result (f result (read-segment dview index))]
+ (if (reduced? result)
+ @result
+ (recur (inc index) result)))
+ result)))
+
+ cljs.core/IHash
+ (-hash [_]
+ (throw (ex-info "not-implemented" {})))
+
+ cljs.core/ICounted
+ (-count [_] size)
+
+ cljs.core/IIndexed
+ (-nth [_ i]
+ (if (in-range? size i)
+ (read-segment dview i)
+ nil))
+
+ (-nth [_ i default]
+ (if (in-range? i size)
+ (read-segment dview i)
+ default))
+
+ cljs.core/ISeqable
+ (-seq [this]
+ (when (pos? size)
+ (->> (range size)
+ (map (fn [i] (cljs.core/-nth this i))))))))
+
+(defn- from-bytes
+ [buffer]
+ #?(:clj
+ (cond
+ (instance? ByteBuffer buffer)
+ (let [size (.capacity ^ByteBuffer buffer)
+ count (long (/ size SEGMENT-BYTE-SIZE))]
+ (PathData. count buffer))
+
+ (bytes? buffer)
+ (let [size (alength ^bytes buffer)
+ count (long (/ size SEGMENT-BYTE-SIZE))]
+ (PathData. count
+ (ByteBuffer/wrap buffer)))
+
+ :else
+ (throw (java.lang.IllegalArgumentException. "invalid data provided")))
+
+ :cljs
+ (cond
+ (instance? js/ArrayBuffer buffer)
+ (let [size (.-byteLength buffer)
+ count (long (/ size SEGMENT-BYTE-SIZE))]
+ (PathData. count
+ buffer
+ (js/DataView. buffer)))
+
+ (instance? js/DataView buffer)
+ (let [dview buffer
+ buffer (.-buffer dview)
+ size (.-byteLength buffer)
+ count (long (/ size SEGMENT-BYTE-SIZE))]
+ (PathData. count buffer dview))
+
+ :else
+ (throw (js/Error. "invalid data provided")))))
+
+;; FIXME: consider implementing with reduce
+;; FIXME: consider ensure fixed precision for avoid doing it on formatting
+
+(defn- from-plain
+ "Create a PathData instance from plain data structures"
+ [content]
+ (assert (check-path-content content))
+
+ (let [content (vec content)
+ total (count content)
+ #?@(:cljs [buffer (new js/ArrayBuffer (* total SEGMENT-BYTE-SIZE))
+ dview (new js/DataView buffer)]
+ :clj [buffer (ByteBuffer/allocate (* total SEGMENT-BYTE-SIZE))])]
+ (loop [index 0]
+ (when (< index total)
+ (let [segment (nth content index)
+ offset (* index SEGMENT-BYTE-SIZE)]
+ (case (get segment :command)
+ :move-to
+ (let [params (get segment :params)
+ x (float (get params :x))
+ y (float (get params :y))]
+ #?(:clj (.putShort buffer (int offset) (short 1))
+ :cljs (.setInt16 dview offset 1))
+ #?(:clj (.putFloat buffer (+ offset 20) x)
+ :cljs (.setFloat32 dview (+ offset 20) x))
+ #?(:clj (.putFloat buffer (+ offset 24) y)
+ :cljs (.setFloat32 dview (+ offset 24) y)))
+
+ :line-to
+ (let [params (get segment :params)
+ x (float (get params :x))
+ y (float (get params :y))]
+ #?(:clj (.putShort buffer (int offset) (short 2))
+ :cljs (.setInt16 dview offset 2))
+ #?(:clj (.putFloat buffer (+ offset 20) x)
+ :cljs (.setFloat32 dview (+ offset 20) x))
+ #?(:clj (.putFloat buffer (+ offset 24) y)
+ :cljs (.setFloat32 dview (+ offset 24) y)))
+
+ :curve-to
+ (let [params (get segment :params)
+ x (float (get params :x))
+ y (float (get params :y))
+ c1x (float (get params :c1x x))
+ c1y (float (get params :c1y y))
+ c2x (float (get params :c2x x))
+ c2y (float (get params :c2y y))]
+
+ #?(:clj (.putShort buffer (int offset) (short 3))
+ :cljs (.setInt16 dview offset 3))
+ #?(:clj (.putFloat buffer (+ offset 4) c1x)
+ :cljs (.setFloat32 dview (+ offset 4) c1x))
+ #?(:clj (.putFloat buffer (+ offset 8) c1y)
+ :cljs (.setFloat32 dview (+ offset 8) c1y))
+ #?(:clj (.putFloat buffer (+ offset 12) c2x)
+ :cljs (.setFloat32 dview (+ offset 12) c2x))
+ #?(:clj (.putFloat buffer (+ offset 16) c2y)
+ :cljs (.setFloat32 dview (+ offset 16) c2y))
+ #?(:clj (.putFloat buffer (+ offset 20) x)
+ :cljs (.setFloat32 dview (+ offset 20) x))
+ #?(:clj (.putFloat buffer (+ offset 24) y)
+ :cljs (.setFloat32 dview (+ offset 24) y)))
+
+ :close-path
+ #?(:clj (.putShort buffer (int offset) (short 4))
+ :cljs (.setInt16 dview offset 4)))
+ (recur (inc index)))))
+
+ #?(:cljs (from-bytes dview)
+ :clj (from-bytes buffer))))
+
+(defn path-data
+ "Create an instance of PathData, returns itself if it is already
+ PathData instance"
+ [data]
+ (cond
+ (instance? PathData data)
+ data
+
+ (sequential? data)
+ (from-plain data)
+
+ :else
+ (from-bytes data)))
diff --git a/common/src/app/common/types/token.cljc b/common/src/app/common/types/token.cljc
index f269e2cca8..e406027d3c 100644
--- a/common/src/app/common/types/token.cljc
+++ b/common/src/app/common/types/token.cljc
@@ -66,16 +66,6 @@
[n]
(string? n))
-;; TODO Move this to tokens-lib
-(sm/register!
- ^{::sm/type ::token}
- [:map {:title "Token"}
- [:name token-name-ref]
- [:type [::sm/one-of token-types]]
- [:value :any]
- [:description {:optional true} [:maybe :string]]
- [:modified-at {:optional true} ::sm/inst]])
-
(sm/register!
^{::sm/type ::color}
[:map
diff --git a/common/src/app/common/types/token_theme.cljc b/common/src/app/common/types/token_theme.cljc
deleted file mode 100644
index 5177fb1c33..0000000000
--- a/common/src/app/common/types/token_theme.cljc
+++ /dev/null
@@ -1,28 +0,0 @@
-;; 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.common.types.token-theme
- (:require
- [app.common.schema :as sm]))
-
-(sm/register!
- ^{::sm/type ::token-theme}
- [:map {:title "TokenTheme"}
- [:name :string]
- [:group :string]
- [:description [:maybe :string]]
- [:is-source :boolean]
- [:id :string]
- [:modified-at {:optional true} ::sm/inst]
- [:sets :any]])
-
-(sm/register!
- ^{::sm/type ::token-set}
- [:map {:title "TokenSet"}
- [:name :string]
- [:description {:optional true} [:maybe :string]]
- [:modified-at {:optional true} ::sm/inst]
- [:tokens {:optional true} :any]])
diff --git a/common/src/app/common/types/tokens_lib.cljc b/common/src/app/common/types/tokens_lib.cljc
index 06b190340e..ffed9c3949 100644
--- a/common/src/app/common/types/tokens_lib.cljc
+++ b/common/src/app/common/types/tokens_lib.cljc
@@ -9,7 +9,9 @@
#?(:clj [app.common.fressian :as fres])
[app.common.data :as d]
[app.common.data.macros :as dm]
+ [app.common.files.helpers :as cfh]
[app.common.schema :as sm]
+ [app.common.schema.generators :as sg]
[app.common.time :as dt]
[app.common.transit :as t]
[app.common.types.token :as cto]
@@ -117,12 +119,15 @@
[:name cto/token-name-ref]
[:type [::sm/one-of cto/token-types]]
[:value :any]
- [:description [:maybe :string]]
- [:modified-at ::sm/inst]])
+ [:description {:optional true} :string]
+ [:modified-at {:optional true} ::sm/inst]])
+
+(declare make-token)
(def schema:token
- [:and
- schema:token-attrs
+ [:and {:gen/gen (->> (sg/generator schema:token-attrs)
+ (sg/fmap #(make-token %)))}
+ (sm/required-keys schema:token-attrs)
[:fn token?]])
(def check-token
@@ -321,6 +326,7 @@
(assoc-in [:ids temp-id] token))))
{:tokens-tree {} :ids {}} tokens))
+
(defprotocol ITokenSet
(update-name [_ set-name] "change a token set name while keeping the path")
(add-token [_ token] "add a token at the end of the list")
@@ -380,15 +386,32 @@
(def schema:token-set-attrs
[:map {:title "TokenSet"}
[:name :string]
- [:description [:maybe :string]]
- [:modified-at ::sm/inst]
- [:tokens [:and
- [:map-of {:gen/max 5} :string schema:token]
- [:fn d/ordered-map?]]]])
+ [:description {:optional true} :string]
+ [:modified-at {:optional true} ::sm/inst]
+ [:tokens {:optional true
+ :gen/gen (->> (sg/generator [:map-of ::sm/text schema:token])
+ (sg/fmap #(into (d/ordered-map) %)))}
+ [:and
+ [:map-of {:gen/max 5
+ :decode/json (fn [v]
+ (cond
+ (d/ordered-map? v)
+ v
+
+ (map? v)
+ (into (d/ordered-map) v)
+
+ :else
+ v))}
+ :string schema:token]
+ [:fn d/ordered-map?]]]])
+
+(declare make-token-set)
(def schema:token-set
- [:and
- schema:token-set-attrs
+ [:and {:gen/gen (->> (sg/generator schema:token-set-attrs)
+ (sg/fmap #(make-token-set %)))}
+ (sm/required-keys schema:token-set-attrs)
[:fn token-set?]])
(sm/register! ::token-set schema:token-set)
@@ -552,16 +575,16 @@
(def schema:token-theme-attrs
[:map {:title "TokenTheme"}
[:name :string]
- [:group :string]
- [:description [:maybe :string]]
- [:is-source [:maybe :boolean]]
- [:id :string]
- [:modified-at ::sm/inst]
- [:sets [:set {:gen/max 5} :string]]])
+ [:group {:optional true} :string]
+ [:description {:optional true} :string]
+ [:is-source {:optional true} :boolean]
+ [:id {:optional true} :string]
+ [:modified-at {:optional true} ::sm/inst]
+ [:sets {:optional true} [:set {:gen/max 5} :string]]])
(def schema:token-theme
[:and
- schema:token-theme-attrs
+ (sm/required-keys schema:token-theme-attrs)
[:fn token-theme?]])
(sm/register! ::token-theme schema:token-theme)
@@ -803,7 +826,7 @@
(map-indexed (fn [index item]
(assoc item :index index))))))
-(defn- flatten-nested-tokens-json
+(defn flatten-nested-tokens-json
"Recursively flatten the dtcg token structure, joining keys with '.'."
[tokens token-path]
(reduce-kv
@@ -830,7 +853,7 @@
(declare make-tokens-lib)
-(defn- legacy-nodes->dtcg-nodes [sets-data]
+(defn legacy-nodes->dtcg-nodes [sets-data]
(walk/postwalk
(fn [node]
(cond-> node
@@ -866,8 +889,6 @@ Will return a value that matches this schema:
(get-active-themes-set-tokens [_] "set of set names that are active in the the active themes")
(encode-dtcg [_] "Encodes library to a dtcg compatible json string")
(decode-dtcg-json [_ parsed-json] "Decodes parsed json containing tokens and converts to library")
- (decode-single-set-json [_ set-name tokens] "Decodes parsed json containing single token set and converts to library")
- (decode-single-set-legacy-json [_ set-name tokens] "Decodes parsed legacy json containing single token set and converts to library")
(decode-legacy-json [_ parsed-json] "Decodes parsed legacy json containing tokens and converts to library")
(get-all-tokens [_] "all tokens in the lib")
(validate [_]))
@@ -922,6 +943,7 @@ Will return a value that matches this schema:
this)))
+
(delete-set [_ set-name]
(let [prefixed-path (set-name->prefixed-full-path set-name)]
(TokensLib. (d/dissoc-in sets prefixed-path)
@@ -1311,17 +1333,6 @@ Will return a value that matches this schema:
(assoc-in ["$metadata" "activeThemes"] active-themes-clear)
(assoc-in ["$metadata" "activeSets"] active-sets))))
- (decode-single-set-json [this set-name tokens]
- (assert (map? tokens) "expected a map data structure for `data`")
-
- (add-set this (make-token-set :name (normalize-set-name set-name)
- :tokens (flatten-nested-tokens-json tokens ""))))
-
-
- (decode-single-set-legacy-json [this set-name tokens]
- (assert (map? tokens) "expected a map data structure for `data`")
- (decode-single-set-json this set-name (legacy-nodes->dtcg-nodes tokens)))
-
(decode-dtcg-json [_ data]
(assert (map? data) "expected a map data structure for `data`")
@@ -1481,6 +1492,14 @@ Will return a value that matches this schema:
{:encode/json encode-dtcg
:decode/json decode-dtcg}})
+(defn duplicate-set [set-name lib & {:keys [suffix]}]
+ (let [sets (get-sets lib)
+ unames (map :name sets)
+ copy-name (cfh/generate-unique-name set-name unames :suffix suffix)]
+ (some-> (get-set lib set-name)
+ (assoc :name copy-name)
+ (assoc :modified-at (dt/now)))))
+
(sm/register! type:tokens-lib)
;; === Serialization handlers for RPC API (transit) and database (fressian)
diff --git a/common/src/app/common/types/variant.cljc b/common/src/app/common/types/variant.cljc
new file mode 100644
index 0000000000..3fe90b92e7
--- /dev/null
+++ b/common/src/app/common/types/variant.cljc
@@ -0,0 +1,281 @@
+;; 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.common.types.variant
+ (:require
+ [app.common.data :as d]
+ [app.common.files.helpers :as cfh]
+ [app.common.math :as math]
+ [app.common.schema :as sm]
+ [cuerdas.core :as str]))
+
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+;; SCHEMA
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+
+(def schema:variant-property
+ [:map
+ [:name :string]
+ [:value :string]])
+
+(def schema:variant-component
+ ;; A component that is part of a variant set.
+ [:map
+ [:variant-id {:optional true} ::sm/uuid]
+ [:variant-properties {:optional true} [:vector schema:variant-property]]])
+
+(def schema:variant-shape
+ ;; The root shape of the main instance of a variant component.
+ [:map
+ [:variant-id {:optional true} ::sm/uuid]
+ [:variant-name {:optional true} :string]])
+
+(def schema:variant-container
+ ;; is a board that contains all variant components of a variant set,
+ ;; for grouping them visually in the workspace.
+ [:map
+ [:is-variant-container {:optional true} :boolean]])
+
+(sm/register! ::variant-property schema:variant-property)
+(sm/register! ::variant-component schema:variant-component)
+(sm/register! ::variant-shape schema:variant-shape)
+(sm/register! ::variant-container schema:variant-container)
+
+(def valid-variant-component?
+ (sm/check-fn schema:variant-component))
+
+
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+
+(def property-prefix "Property")
+(def property-regex (re-pattern (str property-prefix "(\\d+)")))
+(def value-prefix "Value ")
+
+
+(defn properties-to-name
+ "Transform the properties into a name, with the values separated by comma"
+ [properties]
+ (->> properties
+ (map :value)
+ (remove str/empty?)
+ (str/join ", ")))
+
+
+(defn next-property-number
+ "Returns the next property number, to avoid duplicates on the property names"
+ [properties]
+ (let [numbers (keep
+ #(some->> (:name %) (re-find property-regex) second d/parse-integer)
+ properties)
+ max-num (if (seq numbers)
+ (apply max numbers)
+ 0)]
+ (inc (max max-num (count properties)))))
+
+(defn add-new-prop
+ "Adds a new property with generated name and provided value to the existing props list."
+ [props value]
+ (conj props {:name (str property-prefix (next-property-number props))
+ :value value}))
+
+(defn add-new-props
+ "Adds new properties with generated names and provided values to the existing props list."
+ [props values]
+ (let [next-prop-num (next-property-number props)
+ xf (map-indexed (fn [i v]
+ {:name (str property-prefix (+ next-prop-num i))
+ :value v}))]
+ (into props xf values)))
+
+(defn path-to-properties
+ "From a list of properties and a name with path, assign each token of the
+ path as value of a different property"
+ ([path properties]
+ (path-to-properties path properties 0))
+ ([path properties min-props]
+ (let [cpath (cfh/split-path path)
+ total-props (max (count cpath) min-props)
+ assigned (mapv #(assoc % :value (nth cpath %2 "")) properties (range))
+ ;; Add empty strings to the end of cpath to reach the minimum number of properties
+ cpath (take total-props (concat cpath (repeat "")))
+ remaining (drop (count properties) cpath)]
+ (add-new-props assigned remaining))))
+
+
+(defn properties-map-to-string
+ "Transforms a map of properties to a string of properties omitting the empty ones"
+ [properties]
+ (->> properties
+ (keep (fn [{:keys [name value]}]
+ (when (not (str/blank? value))
+ (str name "=" value))))
+ (str/join ", ")))
+
+
+(defn properties-string-to-map
+ "Transforms a string of properties to a map of properties"
+ [s]
+ (->> (str/split s ",")
+ (mapv #(str/split % "="))
+ (mapv (fn [[k v]]
+ {:name (str/trim k)
+ :value (str/trim v)}))))
+
+
+(defn valid-properties-string?
+ "Checks if a string of properties has a processable format or not"
+ [s]
+ (let [pattern #"^([a-zA-Z0-9\s]+=[a-zA-Z0-9\s]+)(,\s*[a-zA-Z0-9\s]+=[a-zA-Z0-9\s]+)*$"]
+ (not (nil? (re-matches pattern s)))))
+
+
+(defn find-properties-to-remove
+ "Compares two property maps to find which properties should be removed"
+ [prev-props upd-props]
+ (let [upd-names (set (map :name upd-props))]
+ (filterv #(not (contains? upd-names (:name %))) prev-props)))
+
+
+(defn find-properties-to-update
+ "Compares two property maps to find which properties should be updated"
+ [prev-props upd-props]
+ (filterv #(some (fn [prop] (and (= (:name %) (:name prop))
+ (not= (:value %) (:value prop)))) prev-props) upd-props))
+
+
+(defn find-properties-to-add
+ "Compares two property maps to find which properties should be added"
+ [prev-props upd-props]
+ (let [prev-names (set (map :name prev-props))]
+ (filterv #(not (contains? prev-names (:name %))) upd-props)))
+
+
+(defn find-index-for-property-name
+ "Finds the index of a name in a property map"
+ [props name]
+ (some (fn [[idx prop]]
+ (when (= (:name prop) name)
+ idx))
+ (map-indexed vector props)))
+
+(defn remove-prefix
+ "Removes the given prefix (with or without a trailing ' / ') from the beginning of the name"
+ [name prefix]
+ (let [long-name (str prefix " / ")]
+ (cond
+ (str/starts-with? name long-name)
+ (subs name (count long-name))
+
+ (str/starts-with? name prefix)
+ (subs name (count prefix))
+
+ :else
+ name)))
+
+(def ^:private xf:map-name
+ (map :name))
+
+(defn- matching-indices
+ [props1 props2]
+ (let [names-in-p2 (into #{} xf:map-name props2)
+ xform (comp
+ (map-indexed (fn [index {:keys [name]}]
+ (when (contains? names-in-p2 name)
+ index)))
+ (filter some?))]
+ (into #{} xform props1)))
+
+(defn- find-index-by-name
+ "Returns the index of the first item in props with the given name, or nil if not found."
+ [name props]
+ (some (fn [[idx item]]
+ (when (= (:name item) name)
+ idx))
+ (map-indexed vector props)))
+
+(defn- next-valid-position
+ "Returns the first non-negative integer not present in the used-pos set."
+ [used-pos]
+ (loop [p 0]
+ (if (contains? used-pos p)
+ (recur (inc p))
+ p)))
+
+(defn- find-position
+ "Returns the index of the property with the given name in `props`,
+ or the next available index not in `used-pos` if not found."
+ [name props used-pos]
+ (or (find-index-by-name name props)
+ (next-valid-position used-pos)))
+
+(defn merge-properties
+ "Merges props2 into props1 with the following rules:
+ - For each property p2 in props2:
+ - Skip it if its value is empty.
+ - If props1 contains a property with the same name, update its value with that of p2.
+ - Otherwise, assign p2's value to the first unused property in props1. A property is considered used if:
+ - Its name exists in both props1 and props2, or
+ - Its value has already been updated during the merge.
+ - If no unused properties are available in props1, append a new property with a default name and p2's value."
+ [props1 props2]
+ (let [props2 (remove #(str/empty? (:value %)) props2)]
+ (-> (reduce
+ (fn [{:keys [props used-pos]} prop]
+ (let [pos (find-position (:name prop) props used-pos)
+ used-pos (conj used-pos pos)]
+ (if (< pos (count props))
+ {:props (assoc-in (vec props) [pos :value] (:value prop)) :used-pos used-pos}
+ {:props (add-new-prop props (:value prop)) :used-pos used-pos})))
+ {:props (vec props1) :used-pos (matching-indices props1 props2)}
+ props2)
+ :props)))
+
+(defn compare-properties
+ "Compares vectors of properties keeping the value if it is the same for all
+ or setting a custom value where their values do not coincide"
+ ([props-list]
+ (compare-properties props-list nil))
+
+ ([props-list distinct-mark]
+ (let [grouped (group-by :name (apply concat props-list))
+ check-values (fn [values]
+ (let [vals (map :value values)]
+ (if (apply = vals)
+ (first vals)
+ distinct-mark)))]
+ (mapv (fn [[name values]]
+ {:name name :value (check-values values)})
+ grouped))))
+
+(defn same-variant?
+ "Determines if all elements belong to the same variant"
+ [components]
+ (let [variant-ids (distinct (map :variant-id components))
+ not-blank? (complement str/blank?)]
+ (and
+ (= 1 (count variant-ids))
+ (not-blank? (first variant-ids)))))
+
+(defn distance
+ "Computes a weighted distance between two property lists `props1` and `props2`.
+ Latter properties weight less that previous ones"
+ [props1 props2]
+ (let [total-num-props (count props1)
+ xform (map-indexed
+ (fn [idx [p1 p2]]
+ (if (not= p1 p2)
+ (math/pow 2 (- total-num-props idx))
+ 0)))]
+ (transduce
+ xform
+ +
+ (map vector props1 props2))))
+
+(defn variant-name-to-name
+ "Transforms a variant-name (its properties values) into a standard name:
+ the real name of the shape joined by the properties values separated by '/'"
+ [variant]
+ (cfh/merge-path-item (:name variant) (str/replace (:variant-name variant) #", " " / ")))
diff --git a/frontend/test/frontend_tests/tokens/token_test.cljs b/common/test/common_tests/files/tokens_test.cljc
similarity index 65%
rename from frontend/test/frontend_tests/tokens/token_test.cljs
rename to common/test/common_tests/files/tokens_test.cljc
index 0124d58404..a16b625c88 100644
--- a/frontend/test/frontend_tests/tokens/token_test.cljs
+++ b/common/test/common_tests/files/tokens_test.cljc
@@ -4,36 +4,36 @@
;;
;; Copyright (c) KALEIDOS INC
-(ns frontend-tests.tokens.token-test
+(ns common-tests.files.tokens-test
(:require
- [app.main.ui.workspace.tokens.token :as wtt]
- [cljs.test :as t :include-macros true]))
+ [app.common.files.tokens :as cft]
+ [clojure.test :as t]))
(t/deftest test-parse-token-value
(t/testing "parses double from a token value"
- (t/is (= {:value 100.1 :unit nil} (wtt/parse-token-value "100.1")))
- (t/is (= {:value -9 :unit nil} (wtt/parse-token-value "-9"))))
+ (t/is (= {:value 100.1 :unit nil} (cft/parse-token-value "100.1")))
+ (t/is (= {:value -9.0 :unit nil} (cft/parse-token-value "-9"))))
(t/testing "trims white-space"
- (t/is (= {:value -1.3 :unit nil} (wtt/parse-token-value " -1.3 "))))
+ (t/is (= {:value -1.3 :unit nil} (cft/parse-token-value " -1.3 "))))
(t/testing "parses unit: px"
- (t/is (= {:value 70.3 :unit "px"} (wtt/parse-token-value " 70.3px "))))
+ (t/is (= {:value 70.3 :unit "px"} (cft/parse-token-value " 70.3px "))))
(t/testing "parses unit: %"
- (t/is (= {:value -10 :unit "%"} (wtt/parse-token-value "-10%"))))
+ (t/is (= {:value -10.0 :unit "%"} (cft/parse-token-value "-10%"))))
(t/testing "parses unit: px")
(t/testing "returns nil for any invalid characters"
- (t/is (nil? (wtt/parse-token-value " -1.3a "))))
+ (t/is (nil? (cft/parse-token-value " -1.3a "))))
(t/testing "doesnt accept invalid double"
- (t/is (nil? (wtt/parse-token-value ".3")))))
+ (t/is (nil? (cft/parse-token-value ".3")))))
(t/deftest token-applied-test
(t/testing "matches passed token with `:token-attributes`"
- (t/is (true? (wtt/token-applied? {:name "a"} {:applied-tokens {:x "a"}} #{:x}))))
+ (t/is (true? (cft/token-applied? {:name "a"} {:applied-tokens {:x "a"}} #{:x}))))
(t/testing "doesn't match empty token"
- (t/is (nil? (wtt/token-applied? {} {:applied-tokens {:x "a"}} #{:x}))))
+ (t/is (nil? (cft/token-applied? {} {:applied-tokens {:x "a"}} #{:x}))))
(t/testing "does't match passed token `:id`"
- (t/is (nil? (wtt/token-applied? {:name "b"} {:applied-tokens {:x "a"}} #{:x}))))
+ (t/is (nil? (cft/token-applied? {:name "b"} {:applied-tokens {:x "a"}} #{:x}))))
(t/testing "doesn't match passed `:token-attributes`"
- (t/is (nil? (wtt/token-applied? {:name "a"} {:applied-tokens {:x "a"}} #{:y})))))
+ (t/is (nil? (cft/token-applied? {:name "a"} {:applied-tokens {:x "a"}} #{:y})))))
(t/deftest shapes-ids-by-applied-attributes
(t/testing "Returns set of matched attributes that fit the applied token"
@@ -54,7 +54,7 @@
shape-applied-x-y
shape-applied-all
shape-applied-none]
- expected (wtt/shapes-ids-by-applied-attributes {:name "1"} shapes attributes)]
+ expected (cft/shapes-ids-by-applied-attributes {:name "1"} shapes attributes)]
(t/is (= (:x expected) (shape-ids shape-applied-x
shape-applied-x-y
shape-applied-all)))
@@ -62,34 +62,34 @@
shape-applied-x-y
shape-applied-all)))
(t/is (= (:z expected) (shape-ids shape-applied-all)))
- (t/is (true? (wtt/shapes-applied-all? expected (shape-ids shape-applied-all) attributes)))
- (t/is (false? (wtt/shapes-applied-all? expected (apply shape-ids shapes) attributes)))
+ (t/is (true? (cft/shapes-applied-all? expected (shape-ids shape-applied-all) attributes)))
+ (t/is (false? (cft/shapes-applied-all? expected (apply shape-ids shapes) attributes)))
(shape-ids shape-applied-x
shape-applied-x-y
shape-applied-all))))
(t/deftest tokens-applied-test
(t/testing "is true when single shape matches the token and attributes"
- (t/is (true? (wtt/shapes-token-applied? {:name "a"} [{:applied-tokens {:x "a"}}
+ (t/is (true? (cft/shapes-token-applied? {:name "a"} [{:applied-tokens {:x "a"}}
{:applied-tokens {:x "b"}}]
#{:x}))))
(t/testing "is false when no shape matches the token or attributes"
- (t/is (nil? (wtt/shapes-token-applied? {:name "a"} [{:applied-tokens {:x "b"}}
+ (t/is (nil? (cft/shapes-token-applied? {:name "a"} [{:applied-tokens {:x "b"}}
{:applied-tokens {:x "b"}}]
#{:x})))
- (t/is (nil? (wtt/shapes-token-applied? {:name "a"} [{:applied-tokens {:x "a"}}
+ (t/is (nil? (cft/shapes-token-applied? {:name "a"} [{:applied-tokens {:x "a"}}
{:applied-tokens {:x "a"}}]
#{:y})))))
(t/deftest name->path-test
- (t/is (= ["foo" "bar" "baz"] (wtt/token-name->path "foo.bar.baz")))
- (t/is (= ["foo" "bar" "baz"] (wtt/token-name->path "foo..bar.baz")))
- (t/is (= ["foo" "bar" "baz"] (wtt/token-name->path "foo..bar.baz...."))))
+ (t/is (= ["foo" "bar" "baz"] (cft/token-name->path "foo.bar.baz")))
+ (t/is (= ["foo" "bar" "baz"] (cft/token-name->path "foo..bar.baz")))
+ (t/is (= ["foo" "bar" "baz"] (cft/token-name->path "foo..bar.baz...."))))
(t/deftest token-name-path-exists?-test
- (t/is (true? (wtt/token-name-path-exists? "border-radius" {"border-radius" {"sm" {:name "sm"}}})))
- (t/is (true? (wtt/token-name-path-exists? "border-radius" {"border-radius" {:name "sm"}})))
- (t/is (true? (wtt/token-name-path-exists? "border-radius.sm" {"border-radius" {:name "sm"}})))
- (t/is (true? (wtt/token-name-path-exists? "border-radius.sm.x" {"border-radius" {:name "sm"}})))
- (t/is (false? (wtt/token-name-path-exists? "other" {"border-radius" {:name "sm"}})))
- (t/is (false? (wtt/token-name-path-exists? "dark.border-radius.md" {"dark" {"border-radius" {"sm" {:name "sm"}}}}))))
+ (t/is (true? (cft/token-name-path-exists? "border-radius" {"border-radius" {"sm" {:name "sm"}}})))
+ (t/is (true? (cft/token-name-path-exists? "border-radius" {"border-radius" {:name "sm"}})))
+ (t/is (true? (cft/token-name-path-exists? "border-radius.sm" {"border-radius" {:name "sm"}})))
+ (t/is (true? (cft/token-name-path-exists? "border-radius.sm.x" {"border-radius" {:name "sm"}})))
+ (t/is (false? (cft/token-name-path-exists? "other" {"border-radius" {:name "sm"}})))
+ (t/is (false? (cft/token-name-path-exists? "dark.border-radius.md" {"dark" {"border-radius" {"sm" {:name "sm"}}}}))))
diff --git a/common/test/common_tests/logic/comp_creation_test.cljc b/common/test/common_tests/logic/comp_creation_test.cljc
index f06ca3a938..462734d6ee 100644
--- a/common/test/common_tests/logic/comp_creation_test.cljc
+++ b/common/test/common_tests/logic/comp_creation_test.cljc
@@ -40,8 +40,6 @@
(:objects page)
(:id page)
(:id file)
- true
- nil
nil)
file' (thf/apply-changes file changes)
@@ -74,8 +72,6 @@
(:objects page)
(:id page)
(:id file)
- true
- nil
cfsh/prepare-create-artboard-from-selection)
file' (thf/apply-changes file changes)
@@ -111,8 +107,6 @@
(:objects page)
(:id page)
(:id file)
- true
- nil
cfsh/prepare-create-artboard-from-selection)
file' (thf/apply-changes file changes)
@@ -151,8 +145,6 @@
(:objects page)
(:id page)
(:id file)
- true
- nil
cfsh/prepare-create-artboard-from-selection)
file' (thf/apply-changes file changes)
@@ -191,8 +183,6 @@
(:objects page)
(:id page)
(:id file)
- true
- nil
nil)
file' (thf/apply-changes file changes)
@@ -232,8 +222,6 @@
(:objects page)
(:id page)
(:id file)
- true
- nil
cfsh/prepare-create-artboard-from-selection)
file' (thf/apply-changes file changes)
@@ -265,8 +253,7 @@
changes (cll/generate-rename-component (pcb/empty-changes)
(:id component)
"Test component after"
- (:data file)
- true)
+ (:data file))
file' (thf/apply-changes file changes)
@@ -445,8 +432,8 @@
(t/is (some? copy1-child'))
(t/is (ctk/instance-root? copy1-root'))
(t/is (ctk/instance-of? copy1-root' (:id file') (:id component')))
- (t/is (ctk/is-main-of? main1-root' copy1-root' true))
- (t/is (ctk/is-main-of? main1-child' copy1-child' true))
+ (t/is (ctk/is-main-of? main1-root' copy1-root'))
+ (t/is (ctk/is-main-of? main1-child' copy1-child'))
(t/is (ctst/parent-of? copy1-root' copy1-child'))))
(t/deftest test-instantiate-component-from-lib
@@ -489,8 +476,8 @@
(t/is (some? copy1-child'))
(t/is (ctk/instance-root? copy1-root'))
(t/is (ctk/instance-of? copy1-root' (:id library) (:id component')))
- (t/is (ctk/is-main-of? main1-root' copy1-root' true))
- (t/is (ctk/is-main-of? main1-child' copy1-child' true))
+ (t/is (ctk/is-main-of? main1-root' copy1-root'))
+ (t/is (ctk/is-main-of? main1-child' copy1-child'))
(t/is (ctst/parent-of? copy1-root' copy1-child'))))
(t/deftest test-instantiate-nested-component
@@ -533,8 +520,8 @@
(t/is (some? copy1-child'))
(t/is (ctk/instance-root? copy1-root'))
(t/is (ctk/instance-of? copy1-root' (:id file') (:id component')))
- (t/is (ctk/is-main-of? main1-root' copy1-root' true))
- (t/is (ctk/is-main-of? main1-child' copy1-child' true))
+ (t/is (ctk/is-main-of? main1-root' copy1-root'))
+ (t/is (ctk/is-main-of? main1-child' copy1-child'))
(t/is (ctst/parent-of? copy1-root' copy1-child'))))
(t/deftest test-instantiate-nested-component-from-lib
@@ -580,8 +567,8 @@
(t/is (some? copy1-child'))
(t/is (ctk/instance-root? copy1-root'))
(t/is (ctk/instance-of? copy1-root' (:id library) (:id component')))
- (t/is (ctk/is-main-of? main1-root' copy1-root' true))
- (t/is (ctk/is-main-of? main1-child' copy1-child' true))
+ (t/is (ctk/is-main-of? main1-root' copy1-root'))
+ (t/is (ctk/is-main-of? main1-child' copy1-child'))
(t/is (ctst/parent-of? copy1-root' copy1-child'))))
(t/deftest test-detach-copy
diff --git a/common/test/common_tests/logic/comp_reset_test.cljc b/common/test/common_tests/logic/comp_reset_test.cljc
index 04abcbeeb4..23894cc398 100644
--- a/common/test/common_tests/logic/comp_reset_test.cljc
+++ b/common/test/common_tests/logic/comp_reset_test.cljc
@@ -47,8 +47,7 @@
file-mdf
{(:id file-mdf) file-mdf}
page-mdf
- (:id copy-root)
- true)
+ (:id copy-root))
file' (thf/apply-changes file changes)
@@ -99,8 +98,7 @@
{(:id file-mdf) file-mdf
(:id library) library}
page-mdf
- (:id copy-root)
- true)
+ (:id copy-root))
file' (thf/apply-changes file changes)
@@ -151,8 +149,7 @@
file-mdf
{(:id file-mdf) file-mdf}
page-mdf
- (:id copy-root)
- true)
+ (:id copy-root))
file' (thf/apply-changes file changes)
@@ -198,8 +195,7 @@
file-mdf
{(:id file-mdf) file-mdf}
page-mdf
- (:id copy-root)
- true)
+ (:id copy-root))
file' (thf/apply-changes file changes)
@@ -246,8 +242,7 @@
file-mdf
{(:id file-mdf) file-mdf}
page-mdf
- (:id copy-root)
- true)
+ (:id copy-root))
file' (thf/apply-changes file changes)
@@ -291,8 +286,7 @@
file-mdf
{(:id file-mdf) file-mdf}
page-mdf
- (:id copy2-root)
- true)
+ (:id copy2-root))
file' (thf/apply-changes file changes)
@@ -338,8 +332,7 @@
file-mdf
{(:id file-mdf) file-mdf}
page-mdf
- (:id copy2-root)
- true)
+ (:id copy2-root))
file' (thf/apply-changes file changes)
diff --git a/common/test/common_tests/logic/comp_sync_test.cljc b/common/test/common_tests/logic/comp_sync_test.cljc
index e5e5d42652..a52ea3d373 100644
--- a/common/test/common_tests/logic/comp_sync_test.cljc
+++ b/common/test/common_tests/logic/comp_sync_test.cljc
@@ -227,7 +227,7 @@
(t/is (= (:touched copy-root') nil))
(t/is (= (:touched copy-new-child') nil))
(t/is (ctst/parent-of? copy-root' copy-new-child'))
- (t/is (ctk/is-main-of? main-free-shape' copy-new-child' true))))
+ (t/is (ctk/is-main-of? main-free-shape' copy-new-child'))))
(t/deftest test-sync-when-deleting-shape
(let [;; ==== Setup
diff --git a/common/test/common_tests/logic/token_test.cljc b/common/test/common_tests/logic/token_test.cljc
index 93548f39a1..a68a96b2a2 100644
--- a/common/test/common_tests/logic/token_test.cljc
+++ b/common/test/common_tests/logic/token_test.cljc
@@ -1,3 +1,9 @@
+;; 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 common-tests.logic.token-test
(:require
[app.common.files.changes-builder :as pcb]
diff --git a/common/test/common_tests/logic/variants_test.cljc b/common/test/common_tests/logic/variants_test.cljc
index e37229d263..98d40253be 100644
--- a/common/test/common_tests/logic/variants_test.cljc
+++ b/common/test/common_tests/logic/variants_test.cljc
@@ -7,7 +7,10 @@
(ns common-tests.logic.variants-test
(:require
[app.common.files.changes-builder :as pcb]
- [app.common.logic.variants :as clv]
+ [app.common.geom.point :as gpt]
+ [app.common.logic.libraries :as cll]
+ [app.common.logic.shapes :as cls]
+ [app.common.logic.variant-properties :as clvp]
[app.common.test-helpers.components :as thc]
[app.common.test-helpers.files :as thf]
[app.common.test-helpers.ids-map :as thi]
@@ -20,7 +23,7 @@
(t/deftest test-update-property-name
(let [;; ==== Setup
file (-> (thf/sample-file :file1)
- (thv/add-variant :v01 :c01 :m01 :c02 :m02))
+ (thv/add-variant-two-properties :v01 :c01 :m01 :c02 :m02))
v-id (-> (ths/get-shape file :v01) :id)
page (thf/current-page file)
@@ -29,8 +32,8 @@
(pcb/with-page-id (:id page))
(pcb/with-library-data (:data file))
(pcb/with-objects (:objects page))
- (clv/generate-update-property-name v-id 0 "NewName1")
- (clv/generate-update-property-name v-id 1 "NewName2"))
+ (clvp/generate-update-property-name v-id 0 "NewName1")
+ (clvp/generate-update-property-name v-id 1 "NewName2"))
file' (thf/apply-changes file changes)
@@ -65,7 +68,7 @@
(pcb/with-page-id (:id page))
(pcb/with-library-data (:data file))
(pcb/with-objects (:objects page))
- (clv/generate-add-new-property v-id))
+ (clvp/generate-add-new-property v-id))
file' (thf/apply-changes file changes)
@@ -101,7 +104,7 @@
(pcb/with-page-id (:id page))
(pcb/with-library-data (:data file))
(pcb/with-objects (:objects page))
- (clv/generate-add-new-property v-id {:fill-values? true}))
+ (clvp/generate-add-new-property v-id {:fill-values? true}))
file' (thf/apply-changes file changes)
@@ -117,7 +120,7 @@
(t/is (= (count (:variant-properties comp01')) 2))
(t/is (= (count (:variant-properties comp02)) 1))
(t/is (= (count (:variant-properties comp02')) 2))
- (t/is (= (-> comp01' :variant-properties last :value) "Value1"))))
+ (t/is (= (-> comp01' :variant-properties last :value) "Value 1"))))
@@ -132,7 +135,7 @@
(pcb/with-page-id (:id page))
(pcb/with-library-data (:data file))
(pcb/with-objects (:objects page))
- (clv/generate-add-new-property v-id))
+ (clvp/generate-add-new-property v-id))
file (thf/apply-changes file changes)
@@ -147,7 +150,7 @@
(pcb/with-page-id (:id page))
(pcb/with-library-data (:data file))
(pcb/with-objects (:objects page))
- (clv/generate-remove-property v-id 0))
+ (clvp/generate-remove-property v-id 0))
file' (thf/apply-changes file changes)
@@ -180,8 +183,8 @@
(pcb/with-page-id (:id page))
(pcb/with-library-data (:data file))
(pcb/with-objects (:objects page))
- (clv/generate-update-property-value (:id comp01) 0 "NewValue1")
- (clv/generate-update-property-value (:id comp02) 0 "NewValue2"))
+ (clvp/generate-update-property-value (:id comp01) 0 "NewValue1")
+ (clvp/generate-update-property-value (:id comp02) 0 "NewValue2"))
file' (thf/apply-changes file changes)
@@ -192,3 +195,73 @@
;; ==== Check
(t/is (= (-> comp01' :variant-properties first :value) "NewValue1"))
(t/is (= (-> comp02' :variant-properties first :value) "NewValue2"))))
+
+
+(t/deftest test-duplicate-variant-container
+ (let [;; ==== Setup
+ file (-> (thf/sample-file :file1)
+ (thv/add-variant :v01 :c01 :m01 :c02 :m02))
+ data (:data file)
+ page (thf/current-page file)
+ objects (:objects page)
+
+ variant-container (ths/get-shape file :v01)
+
+
+
+
+ ;; ==== Action
+ changes (-> (pcb/empty-changes nil)
+ (pcb/with-page-id (:id page))
+ (pcb/with-library-data (:data file))
+ (pcb/with-objects (:objects page))
+ (cll/generate-duplicate-changes objects ;; objects
+ page ;; page
+ #{(:id variant-container)} ;; ids
+ (gpt/point 0 0) ;; delta
+ {(:id file) file} ;; libraries
+ (:data file) ;; library-data
+ (:id file))) ;; file-id
+
+ ;; ==== Get
+ file' (thf/apply-changes file changes)
+ data' (:data file')
+ page' (thf/current-page file')
+ objects' (:objects page')]
+
+ ;; ==== Check
+ (thf/validate-file! file')
+ (t/is (= (count (:components data)) 2))
+ (t/is (= (count (:components data')) 4))
+ (t/is (= (count objects) 4))
+ (t/is (= (count objects') 7))))
+
+
+(t/deftest test-delete-variant
+ ;; When a variant container becomes empty, it id automatically deleted
+ (let [;; ==== Setup
+ file (-> (thf/sample-file :file1)
+ (thv/add-variant-two-properties :v01 :c01 :m01 :c02 :m02))
+ container (ths/get-shape file :v01)
+ m01-id (-> (ths/get-shape file :m01) :id)
+ m02-id (-> (ths/get-shape file :m02) :id)
+
+ page (thf/current-page file)
+
+ ;; ==== Action
+ changes (-> (pcb/empty-changes nil)
+ (pcb/with-page-id (:id page))
+ (pcb/with-library-data (:data file))
+ (pcb/with-objects (:objects page))
+ (#(second (cls/generate-delete-shapes % #{m01-id m02-id} {}))))
+
+ file' (thf/apply-changes file changes)
+
+ ;; ==== Get
+ container' (ths/get-shape file' :v01)]
+
+ ;; ==== Check
+ ;; The variant containew was not nil before the deletion
+ (t/is (not (nil? container)))
+ ;; The variant containew is nil after the deletion
+ (t/is (nil? container'))))
diff --git a/common/test/common_tests/runner.cljc b/common/test/common_tests/runner.cljc
index 06a3fc58d7..c7e502bd51 100644
--- a/common/test/common_tests/runner.cljc
+++ b/common/test/common_tests/runner.cljc
@@ -41,6 +41,7 @@
[common-tests.types.modifiers-test]
[common-tests.types.shape-decode-encode-test]
[common-tests.types.shape-interactions-test]
+ [common-tests.types.shape-path-data-test]
[common-tests.types.tokens-lib-test]
[common-tests.uuid-test]))
@@ -90,4 +91,5 @@
'common-tests.types.tokens-lib-test
'common-tests.types.components-test
'common-tests.types.absorb-assets-test
+ 'common-tests.types.shape-path-data-test
'common-tests.uuid-test))
diff --git a/common/test/common_tests/svg_path_test.cljc b/common/test/common_tests/svg_path_test.cljc
index c9e9adcc89..7a826db6ac 100644
--- a/common/test/common_tests/svg_path_test.cljc
+++ b/common/test/common_tests/svg_path_test.cljc
@@ -547,4 +547,3 @@
;; FOR POSSIBLE FUTURE TEST CASES
;; (str "M259.958 89.134c-6.88-.354-10.484-1.241-12.44-3.064-1.871-1.743-6.937-3.098-15.793-4.226-7.171-.913-17.179-2.279-22.24-3.034-5.06-.755-15.252-2.016-22.648-2.8-18.685-1.985-35.63-4.223-38.572-5.096-3.655-1.084-3.016-3.548.708-2.726 1.751.387 13.376 1.701 25.833 2.922 12.456 1.22 29.018 3.114 36.803 4.208 29.94 4.206 29.433 4.204 34.267.136 3.787-3.186 5.669-3.669 14.303-3.669 14.338 0 17.18 1.681 12.182 7.205-2.053 2.268-1.994 2.719.707 5.42 3.828 3.827 3.74 5.846-.238 5.5-1.752-.153-7.544-.502-12.872-.776zm7.563-3.194c0-.778-1.751-1.352-3.892-1.274l-3.893.141 3.539 1.133c1.946.624 3.698 1.197 3.893 1.275.194.077.354-.496.354-1.275zm-15.899-8.493c1.43-2.29 1.414-2.83-.084-2.83-2.05 0-5.25 2.76-5.25 4.529 0 2.226 3.599 1.08 5.334-1.699zm8.114 0c2.486-2.746 2.473-2.83-.438-2.83-1.65 0-3.683 1.273-4.516 2.83-1.175 2.196-1.077 2.831.438 2.831 1.075 0 3.107-1.274 4.516-2.83zm7.814.674c2.858-3.444.476-4.085-3.033-.816-2.451 2.284-2.677 2.973-.975 2.973 1.22 0 3.023-.97 4.008-2.157zm-49.571-4.509c-1.168-.43-3.294-1.802-4.725-3.051-2.112-1.843-9.304-2.595-38.219-3.994-46.474-2.25-63-4.077-60.27-6.665.324-.308 9.507.261 20.406 1.264 10.9 1.003 31.16 2.258 45.024 2.789l25.207.964 4.625-3.527c4.313-3.29 5.41-3.474 16.24-2.732 6.389.438 11.981 1.388 12.428 2.111.447.723-.517 2.73-2.141 4.46l-2.954 3.144c1.607 1.697 3.308 3.289 5.049 4.845 3.248 2.189-5.438 1.289-8.678 1.284-5.428-.061-10.825-.463-11.992-.892zm12.74-3.242c-1.123-.694-2.36-.943-2.75-.554-.389.39.21 1.275 1.334 1.97 1.122.693 2.36.942 2.749.553.389-.39-.21-1.275-1.334-1.97zm-5.663 0a1.42 1.42 0 00-1.415-1.416 1.42 1.42 0 00-1.416 1.416 1.42 1.42 0 001.416 1.415 1.42 1.42 0 001.415-1.415zm-8.464-6.404c.984-1.187 1.35-2.598.813-3.135-1.181-1.18-5.408 1.297-6.184 3.624-.806 2.42 3.265 2.048 5.37-.49zm6.863.258c.867-1.045 1.163-2.313.658-2.819-1.063-1.062-4.719 1.631-4.719 3.476 0 1.864 2.274 1.496 4.061-.657zm8.792-.36c1.637-1.972 1.448-2.197-1.486-1.77-1.848.27-3.622 1.287-3.943 2.26-.838 2.547 3.212 2.181 5.429-.49zm32.443-4.11c-6.156-2.228-67.1-6.138-119.124-7.642-39.208-1.134-72.072-.928-94.618.593-6.617.446-19.681 1.16-29.03 1.587-15.798.72-17.183.573-19.588-2.085-4.498-4.97-2.544-7.857 6.39-9.44 4.394-.778 9.164-2.436 10.6-3.685 5.44-4.729 20.332-14.06 31.14-19.509C65.717 11.88 78.955 7.79 103.837 3.08 121.686-.3 125.552-.642 129.318.82c2.44.948 12.4 1.948 22.132 2.221 15.37.432 20.004 1.18 35.294 5.698 22.36 6.606 39.732 15.1 56.55 27.653 7.307 5.452 14.086 9.913 15.066 9.913.98 0 2.148.956 2.596 2.124.55 1.432 2.798 2.123 6.914 2.123 6.213 0 12.4 3.046 12.38 6.096-.012 1.75-6.502 5.353-9.118 5.063-.818-.09-3.717-.972-6.442-1.958zm-16.986-7.436c0-1.575-33.326-18.118-43.173-21.43-23.008-7.739-54.084-12.922-77.136-12.866-16.863.041-37.877 3.628-52.465 8.956-18.062 6.596-26.563 10.384-29.181 13.002-1.205 1.205-5.306 3.769-9.112 5.698-7.754 3.929-8.841 5.482-3.029 4.325 13.494-2.685 66.794-3.773 110.913-2.264 38.005 1.3 96.812 4.435 102.122 5.443.584.111 1.061-.277 1.061-.864zm-236.39-3.18c0-.78-1.592-1.416-3.539-1.416-1.946 0-3.538.637-3.538 1.415 0 .779 1.592 1.416 3.538 1.416 1.947 0 3.54-.637 3.54-1.416zm7.078-1.416c0-.779-.956-1.416-2.124-1.416-1.167 0-2.123.637-2.123 1.416 0 .778.956 1.415 2.123 1.415 1.168 0 2.124-.637 2.124-1.415zm11.734-4.437c3.278-1.661 6.278-3.483 6.667-4.048 1.366-1.98 20.645-11.231 32.557-15.622 11.862-4.372 36.546-9.865 44.327-9.865 3.485 0 3.867-.404 3.012-3.185-.538-1.752-1.177-3.41-1.42-3.685-.907-1.026-36.72 7.16-45.065 10.302-17.226 6.484-47.566 24.27-47.566 27.886 0 1.786.845 1.585 7.488-1.783zm206.254-5.577c-12.298-10.518-53.842-27.166-70.896-28.41-5.526-.404-6.3-.097-6.695 2.655-.33 2.307.402 3.275 2.831 3.742 32.436 6.237 52.205 12.315 66.975 20.594 11.904 6.673 14.477 7.141 7.785 1.419zM150.1 11.04c-1.949-3.64-7.568-4.078-6.886-.538.256 1.329 2.054 2.817 3.997 3.309 4.498 1.137 4.816.832 2.888-2.771zm6.756.94c-.248-1.752-1.026-3.185-1.727-3.185-.7 0-1.493 1.433-1.76 3.185-.328 2.152.232 3.185 1.727 3.185 1.485 0 2.064-1.047 1.76-3.185zm-30.178-2.458c0-2.303-.908-3.694-2.627-4.025-3.6-.694-5.23 1.301-4.22 5.166 1.216 4.647 6.847 3.709 6.847-1.14zm12.544 2.104c-.448-1.168-1.224-2.132-1.725-2.142-.5-.013-2.343-.404-4.095-.873-2.569-.689-3.185-.274-3.185 2.142 0 2.476.854 2.996 4.91 2.996 3.783 0 4.723-.487 4.095-2.123z")
-
diff --git a/common/test/common_tests/types/absorb_assets_test.cljc b/common/test/common_tests/types/absorb_assets_test.cljc
index 790d029b0b..382b3a681f 100644
--- a/common/test/common_tests/types/absorb_assets_test.cljc
+++ b/common/test/common_tests/types/absorb_assets_test.cljc
@@ -54,7 +54,7 @@
(t/is (= (count components') 1))
(t/is (ctk/instance-of? copy-root' (:id file') (:id component')))
- (t/is (ctk/is-main-of? main-root' copy-root' true))
+ (t/is (ctk/is-main-of? main-root' copy-root'))
(t/is (ctk/main-instance-of? (:id main-root') (:id (second pages')) component'))))
(t/deftest absorb-colors
diff --git a/common/test/common_tests/types/data/legacy-single-set.json b/common/test/common_tests/types/data/legacy-single-set.json
deleted file mode 100644
index e69153a763..0000000000
--- a/common/test/common_tests/types/data/legacy-single-set.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{"color":
- {"red":
- {"100":
- {"value":"red",
- "type":"color",
- "description":""}}}}
diff --git a/common/test/common_tests/types/data/single-set.json b/common/test/common_tests/types/data/single-set.json
deleted file mode 100644
index d558781ae0..0000000000
--- a/common/test/common_tests/types/data/single-set.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{"color":
- {"red":
- {"100":
- {"$value":"red",
- "$type":"color",
- "$description":""}}}}
diff --git a/common/test/common_tests/types/shape_path_data_test.cljc b/common/test/common_tests/types/shape_path_data_test.cljc
new file mode 100644
index 0000000000..79430e883f
--- /dev/null
+++ b/common/test/common_tests/types/shape_path_data_test.cljc
@@ -0,0 +1,59 @@
+;; 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 common-tests.types.shape-path-data-test
+ (:require
+ [app.common.data :as d]
+ [app.common.math :as mth]
+ [app.common.pprint :as pp]
+ [app.common.types.shape.path :as path]
+ [clojure.test :as t]))
+
+(def sample-content
+ [{:command :move-to, :params {:x 480.0, :y 839.0}}
+ {:command :line-to, :params {:x 439.0, :y 802.0}}
+ {:command :curve-to, :params {:c1x 368.0, :c1y 737.0, :c2x 310.0, :c2y 681.0, :x 264.0, :y 634.0}}
+ {:command :close-path :params {}}])
+
+(def sample-bytes
+ [0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 67 -16 0 0 68 81 -64 0
+ 0 2 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 67 -37 -128 0 68 72 -128 0
+ 0 3 0 0 67 -72 0 0 68 56 64 0 67 -101 0 0 68 42 64 0 67 -124 0 0 68 30 -128 0
+ 0 4 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0])
+
+;; This means it implements IReduceInit/IReduce protocols
+(t/deftest path-data-to-vector
+ (let [pdata (path/path-data sample-content)
+ result (vec pdata)]
+ (t/is (= 4 (count result)))
+ (t/is (= (get-in sample-content [0 :command])
+ (get-in result [0 :command])))
+ (t/is (= (get-in sample-content [1 :command])
+ (get-in result [1 :command])))
+ (t/is (= (get-in sample-content [2 :command])
+ (get-in result [2 :command])))
+ (t/is (= (get-in sample-content [3 :command])
+ (get-in result [3 :command])))
+
+ (t/is (= (get-in sample-content [0 :params])
+ (get-in result [0 :params])))
+ (t/is (= (get-in sample-content [1 :params])
+ (get-in result [1 :params])))
+ (t/is (= (get-in sample-content [2 :params])
+ (get-in result [2 :params])))
+ (t/is (= (get-in sample-content [3 :params])
+ (get-in result [3 :params])))))
+
+(t/deftest path-data-plain-to-binary
+ (let [pdata (path/path-data sample-content)]
+ (t/is (= sample-bytes
+ (vec
+ #?(:cljs (js/Int8Array. (.-buffer pdata))
+ :clj (.array (.-buffer pdata))))))
+ (t/is (= (->> sample-content
+ (mapv path/map->PathSegment))
+ (vec pdata)))))
+
diff --git a/common/test/common_tests/types/tokens_lib_test.cljc b/common/test/common_tests/types/tokens_lib_test.cljc
index 0a41f37e5c..ab660fcba9 100644
--- a/common/test/common_tests/types/tokens_lib_test.cljc
+++ b/common/test/common_tests/types/tokens_lib_test.cljc
@@ -120,7 +120,6 @@
(t/is (= ["Foo/Foo" "Foo/Baz" "Foo/Bar"] (move ["Foo"] ["Foo" "Foo"] ["Foo" "Baz"] false)))
(t/is (= ["Foo/Baz" "Foo/Bar" "Foo/Foo"] (move ["Foo"] ["Foo" "Foo"] nil false))))))
-
(t/deftest move-token-set-nested-2
(let [tokens-lib (-> (ctob/make-tokens-lib)
(ctob/add-set (ctob/make-token-set :name "a/b"))
@@ -220,7 +219,6 @@
(t/is (thrown-with-msg? #?(:cljs js/Error :clj Exception) #"expected valid params for token-theme"
(ctob/make-token-theme params)))))
-
(t/deftest make-tokens-lib
(let [tokens-lib (ctob/make-tokens-lib)]
(t/is (= (ctob/set-count tokens-lib) 0))))
@@ -315,6 +313,58 @@
(t/is (= (:sets token-theme') #{}))
(t/is (nil? token-set'))))
+(t/deftest duplicate-token-set
+ (let [tokens-lib (-> (ctob/make-tokens-lib)
+ (ctob/add-set (ctob/make-token-set :name "test-token-set"
+ :tokens {"test-token"
+ (ctob/make-token :name "test-token"
+ :type :boolean
+ :value true)})))
+ token-set-copy (ctob/duplicate-set "test-token-set" tokens-lib {:suffix "copy"})
+ token (get-in token-set-copy [:tokens "test-token"])]
+
+ (t/is (some? token-set-copy))
+ (t/is (= (:name token-set-copy) "test-token-set-copy"))
+ (t/is (= (count (:tokens token-set-copy)) 1))
+ (t/is (= (:name token) "test-token"))))
+
+(t/deftest duplicate-token-set-twice
+ (let [tokens-lib (-> (ctob/make-tokens-lib)
+ (ctob/add-set (ctob/make-token-set :name "test-token-set"
+ :tokens {"test-token"
+ (ctob/make-token :name "test-token"
+ :type :boolean
+ :value true)})))
+
+ tokens-lib (ctob/add-set tokens-lib (ctob/duplicate-set "test-token-set" tokens-lib {:suffix "copy"}))
+
+ token-set-copy (ctob/duplicate-set "test-token-set" tokens-lib {:suffix "copy"})
+ token (get-in token-set-copy [:tokens "test-token"])]
+
+ (t/is (some? token-set-copy))
+ (t/is (= (:name token-set-copy) "test-token-set-copy-2"))
+ (t/is (= (count (:tokens token-set-copy)) 1))
+ (t/is (= (:name token) "test-token"))))
+
+(t/deftest duplicate-empty-token-set
+ (let [tokens-lib (-> (ctob/make-tokens-lib)
+ (ctob/add-set (ctob/make-token-set :name "test-token-set")))
+
+ token-set-copy (ctob/duplicate-set "test-token-set" tokens-lib {:suffix "copy"})
+ tokens (get token-set-copy :tokens)]
+
+ (t/is (some? token-set-copy))
+ (t/is (= (:name token-set-copy) "test-token-set-copy"))
+ (t/is (= (count (:tokens token-set-copy)) 0))
+ (t/is (= (count tokens) 0))))
+
+(t/deftest duplicate-not-existing-token-set
+ (let [tokens-lib (ctob/make-tokens-lib)
+
+ token-set-copy (ctob/duplicate-set "test-token-set" tokens-lib {:suffix "copy"})]
+
+ (t/is (nil? token-set-copy))))
+
(t/deftest active-themes-set-names
(let [tokens-lib (-> (ctob/make-tokens-lib)
(ctob/add-set (ctob/make-token-set :name "test-token-set")))
@@ -918,7 +968,6 @@
(t/is (dt/is-after? (:modified-at token-set') (:modified-at token-set)))
(t/is (dt/is-after? (:modified-at token') (:modified-at token)))))
-
(t/deftest update-token-in-sets-rename
(let [tokens-lib (-> (ctob/make-tokens-lib)
(ctob/add-set (ctob/make-token-set :name "test-token-set"))
@@ -1371,30 +1420,6 @@
(t/testing "invalid tokens got discarded"
(t/is (nil? (get-set-token "typography" "H1.Bold")))))))
-#?(:clj
- (t/deftest single-set-legacy-json-decoding
- (let [json (-> (slurp "test/common_tests/types/data/legacy-single-set.json")
- (tr/decode-str))
- lib (ctob/decode-single-set-legacy-json (ctob/ensure-tokens-lib nil) "single_set" json)
- get-set-token (fn [set-name token-name]
- (some-> (ctob/get-set lib set-name)
- (ctob/get-token token-name)))]
- (t/is (= '("single_set") (ctob/get-ordered-set-names lib)))
- (t/testing "token added"
- (t/is (some? (get-set-token "single_set" "color.red.100")))))))
-
-#?(:clj
- (t/deftest single-set-dtcg-json-decoding
- (let [json (-> (slurp "test/common_tests/types/data/single-set.json")
- (tr/decode-str))
- lib (ctob/decode-single-set-json (ctob/ensure-tokens-lib nil) "single_set" json)
- get-set-token (fn [set-name token-name]
- (some-> (ctob/get-set lib set-name)
- (ctob/get-token token-name)))]
- (t/is (= '("single_set") (ctob/get-ordered-set-names lib)))
- (t/testing "token added"
- (t/is (some? (get-set-token "single_set" "color.red.100")))))))
-
#?(:clj
(t/deftest dtcg-encoding-decoding-json
(let [json (-> (slurp "test/common_tests/types/data/tokens-multi-set-example.json")
diff --git a/common/test/common_tests/types/variant_test.cljc b/common/test/common_tests/types/variant_test.cljc
new file mode 100644
index 0000000000..258b41e8a8
--- /dev/null
+++ b/common/test/common_tests/types/variant_test.cljc
@@ -0,0 +1,112 @@
+;; 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 common-tests.types.variant-test
+ (:require
+ [app.common.types.variant :as ctv]
+ [clojure.test :as t]))
+
+
+(t/deftest variant-distance01
+ ;;c1: primary, default, rounded, blue, dark
+ ;;c2: primary, hover, squared, blue, dark
+ ;;c3: primary, default, squared, blue, light
+
+ ;; I have a copy of c1, and I change from rounded to squared
+ ;; c2: 1 difference in pos 2
+ ;; c3: 1 differences in pos 5
+ ;; The min distance should be c3
+
+ (let [target [{:name "type" :value "primary"}
+ {:name "status" :value "default"}
+ {:name "borders" :value "squared"}
+ {:name "color" :value "blue"}
+ {:name "theme" :value "dark"}]
+ props2 [{:name "type" :value "primary"}
+ {:name "status" :value "hover"}
+ {:name "borders" :value "rounded"}
+ {:name "color" :value "blue"}
+ {:name "theme" :value "dark"}]
+ props3 [{:name "type" :value "primary"}
+ {:name "status" :value "default"}
+ {:name "borders" :value "rounded"}
+ {:name "color" :value "blue"}
+ {:name "theme" :value "light"}]
+ dist2 (ctv/distance target props2)
+ dist3 (ctv/distance target props3)]
+ (t/is (< dist3 dist2))))
+
+
+(t/deftest variant-distance02
+ ;;c1: primary, default, rounded, blue, dark
+ ;;c2: primary, hover, squared, red, dark
+ ;;c3: secondary, hover, rounded, blue, dark
+
+ ;; I have a copy of c1, and I change from default to hover
+ ;; c2: 2 differences in pos 3 and 4
+ ;; c3: 1 differences in pos 1
+ ;; The min distance should be c2
+
+ (let [target [{:name "type" :value "primary"}
+ {:name "status" :value "hover"}
+ {:name "borders" :value "rounded"}
+ {:name "color" :value "blue"}
+ {:name "theme" :value "dark"}]
+ props2 [{:name "type" :value "primary"}
+ {:name "status" :value "hover"}
+ {:name "borders" :value "squared"}
+ {:name "color" :value "red"}
+ {:name "theme" :value "dark"}]
+ props3 [{:name "type" :value "secondary"}
+ {:name "status" :value "hover"}
+ {:name "borders" :value "rounded"}
+ {:name "color" :value "blue"}
+ {:name "theme" :value "dark"}]
+ dist2 (ctv/distance target props2)
+ dist3 (ctv/distance target props3)]
+ (t/is (< dist2 dist3))))
+
+(t/deftest variant-distance03
+ ;;c1: primary, default, rounded, blue, dark
+ ;;c2: secondary, default, rounded, blue, light
+ ;;c3: secondary, hover, squared, blue, dark
+ ;;c4: secondary, hover, rounded, blue, dark
+
+ ;; I have a copy of c1, and I change from primary to secondary
+ ;; c2: 1 difference in pos 4
+ ;; c3: 2 differences in pos 1 and 2
+ ;; c4: 1 difference in pos 1
+ ;; The distances should be c2 < c4 < c3
+
+ (let [target [{:name "type" :value "secondary"}
+ {:name "status" :value "default"}
+ {:name "borders" :value "rounded"}
+ {:name "color" :value "blue"}
+ {:name "theme" :value "dark"}]
+ props2 [{:name "type" :value "secondary"}
+ {:name "status" :value "default"}
+ {:name "borders" :value "rounded"}
+ {:name "color" :value "blue"}
+ {:name "theme" :value "light"}]
+ props3 [{:name "type" :value "secondary"}
+ {:name "status" :value "hover"}
+ {:name "borders" :value "squared"}
+ {:name "color" :value "blue"}
+ {:name "theme" :value "dark"}]
+ props4 [{:name "type" :value "secondary"}
+ {:name "status" :value "hover"}
+ {:name "borders" :value "rounded"}
+ {:name "color" :value "blue"}
+ {:name "theme" :value "dark"}]
+ dist2 (ctv/distance target props2)
+ dist3 (ctv/distance target props3)
+ dist4 (ctv/distance target props4)]
+ (t/is (< dist2 dist4))
+ (t/is (< dist4 dist3))))
+
+
+
+
diff --git a/common/test/common_tests/variant_test.cljc b/common/test/common_tests/variant_test.cljc
new file mode 100644
index 0000000000..78ac25d097
--- /dev/null
+++ b/common/test/common_tests/variant_test.cljc
@@ -0,0 +1,108 @@
+;; 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 common-tests.variant-test
+ (:require
+ [app.common.types.variant :as ctv]
+ [clojure.test :as t]))
+
+(t/deftest convert-between-variant-properties-maps-and-strings
+ (let [map-with-two-props [{:name "border" :value "yes"} {:name "color" :value "gray"}]
+ map-with-two-props-one-blank [{:name "border" :value "no"} {:name "color" :value ""}]
+ map-with-one-prop [{:name "border" :value "no"}]
+ map-with-spaces [{:name "border 1" :value "of course"} {:name "color 2" :value "dark gray"}]
+
+ string-valid-with-two-props "border=yes, color=gray"
+ string-valid-with-one-prop "border=no"
+ string-valid-with-spaces "border 1=of course, color 2=dark gray"
+ string-invalid "border=yes, color="]
+
+ (t/testing "convert map to string"
+ (t/is (= (ctv/properties-map-to-string map-with-two-props) string-valid-with-two-props))
+ (t/is (= (ctv/properties-map-to-string map-with-two-props-one-blank) string-valid-with-one-prop))
+ (t/is (= (ctv/properties-map-to-string map-with-spaces) string-valid-with-spaces)))
+
+ (t/testing "convert string to map"
+ (t/is (= (ctv/properties-string-to-map string-valid-with-two-props) map-with-two-props))
+ (t/is (= (ctv/properties-string-to-map string-valid-with-one-prop) map-with-one-prop))
+ (t/is (= (ctv/properties-string-to-map string-valid-with-spaces) map-with-spaces)))
+
+ (t/testing "check if a string is valid"
+ (t/is (= (ctv/valid-properties-string? string-valid-with-two-props) true))
+ (t/is (= (ctv/valid-properties-string? string-valid-with-one-prop) true))
+ (t/is (= (ctv/valid-properties-string? string-valid-with-spaces) true))
+ (t/is (= (ctv/valid-properties-string? string-invalid) false)))))
+
+
+(t/deftest find-properties
+ (let [prev-props [{:name "border" :value "yes"} {:name "color" :value "gray"}]
+ upd-props-1 [{:name "border" :value "yes"}]
+ upd-props-2 [{:name "border" :value "yes"} {:name "color" :value "blue"}]
+ upd-props-3 [{:name "border" :value "yes"} {:name "color" :value "gray"} {:name "shadow" :value "large"}]
+ upd-props-4 [{:name "color" :value "yellow"} {:name "shadow" :value "large"}]]
+
+ (t/testing "a property to remove"
+ (t/is (= (ctv/find-properties-to-remove prev-props upd-props-1)
+ [{:name "color" :value "gray"}]))
+ (t/is (= (ctv/find-properties-to-update prev-props upd-props-1)
+ []))
+ (t/is (= (ctv/find-properties-to-add prev-props upd-props-1)
+ [])))
+
+ (t/testing "a property to update"
+ (t/is (= (ctv/find-properties-to-remove prev-props upd-props-2)
+ []))
+ (t/is (= (ctv/find-properties-to-update prev-props upd-props-2)
+ [{:name "color" :value "blue"}]))
+ (t/is (= (ctv/find-properties-to-add prev-props upd-props-2)
+ [])))
+
+ (t/testing "a property to add"
+ (t/is (= (ctv/find-properties-to-remove prev-props upd-props-3)
+ []))
+ (t/is (= (ctv/find-properties-to-update prev-props upd-props-3)
+ []))
+ (t/is (= (ctv/find-properties-to-add prev-props upd-props-3)
+ [{:name "shadow" :value "large"}])))
+
+ (t/testing "properties to remove, update & add"
+ (t/is (= (ctv/find-properties-to-remove prev-props upd-props-4)
+ [{:name "border" :value "yes"}]))
+ (t/is (= (ctv/find-properties-to-update prev-props upd-props-4)
+ [{:name "color" :value "yellow"}]))
+ (t/is (= (ctv/find-properties-to-add prev-props upd-props-4)
+ [{:name "shadow" :value "large"}])))
+
+ (t/testing "find property index"
+ (t/is (= (ctv/find-index-for-property-name prev-props "border") 0))
+ (t/is (= (ctv/find-index-for-property-name prev-props "color") 1)))))
+
+
+(t/deftest compare-properties
+ (let [props-1 [{:name "border" :value "yes"} {:name "color" :value "gray"}]
+ props-2 [{:name "border" :value "yes"} {:name "color" :value "red"}]
+ props-3 [{:name "border" :value "no"} {:name "color" :value "gray"}]]
+
+ (t/testing "compare properties"
+ (t/is (= (ctv/compare-properties [props-1 props-2])
+ [{:name "border" :value "yes"} {:name "color" :value nil}]))
+ (t/is (= (ctv/compare-properties [props-1 props-2 props-3])
+ [{:name "border" :value nil} {:name "color" :value nil}]))
+ (t/is (= (ctv/compare-properties [props-1 props-2 props-3] "&")
+ [{:name "border" :value "&"} {:name "color" :value "&"}])))))
+
+
+(t/deftest check-belong-same-variant
+ (let [components-1 [{:variant-id "a variant"} {:variant-id "a variant"}]
+ components-2 [{:variant-id "a variant"} {:variant-id "another variant"}]
+ components-3 [{:variant-id "a variant"} {}]
+ components-4 [{} {}]]
+
+ (t/testing "check-belong-same-variant"
+ (t/is (= (ctv/same-variant? components-1) true))
+ (t/is (= (ctv/same-variant? components-2) false))
+ (t/is (= (ctv/same-variant? components-3) false))
+ (t/is (= (ctv/same-variant? components-4) false)))))
diff --git a/docker/devenv/Dockerfile b/docker/devenv/Dockerfile
index 29b6e7c544..d9105fbe49 100644
--- a/docker/devenv/Dockerfile
+++ b/docker/devenv/Dockerfile
@@ -1,15 +1,16 @@
-FROM debian:bookworm
+FROM ubuntu:24.04
LABEL maintainer="Penpot "
ARG DEBIAN_FRONTEND=noninteractive
-ENV NODE_VERSION=v22.13.1 \
+ENV NODE_VERSION=v22.14.0 \
CLOJURE_VERSION=1.12.0.1501 \
CLJKONDO_VERSION=2025.01.16 \
BABASHKA_VERSION=1.12.196 \
CLJFMT_VERSION=0.13.0 \
RUSTUP_VERSION=1.27.1 \
RUST_VERSION=1.85.0 \
+ EMSCRIPTEN_VERSION=4.0.6 \
LANG=en_US.UTF-8 \
LC_ALL=en_US.UTF-8
@@ -45,7 +46,7 @@ RUN set -ex; \
rm -rf /var/lib/apt/lists/*;
RUN set -ex; \
- useradd -m -g users -s /bin/bash penpot; \
+ usermod -l penpot -d /home/penpot -G users -s /bin/bash ubuntu; \
passwd penpot -d; \
echo "penpot ALL=(ALL) NOPASSWD:ALL" >> /etc/sudoers
@@ -63,8 +64,6 @@ RUN set -ex; \
woff-tools \
woff2 \
fontforge \
- gconf-service \
- libasound2 \
libatk1.0-0 \
libatk-bridge2.0-0 \
libcairo2 \
@@ -73,7 +72,6 @@ RUN set -ex; \
libexpat1 \
libfontconfig1 \
libgcc1 \
- libgconf-2-4 \
libgdk-pixbuf2.0-0 \
libglib2.0-0 \
libgtk-3-0 \
@@ -95,7 +93,6 @@ RUN set -ex; \
libxss1 \
libxtst6 \
fonts-liberation \
- libappindicator1 \
libnss3 \
libgbm1 \
xvfb \
@@ -107,12 +104,12 @@ RUN set -eux; \
ARCH="$(dpkg --print-architecture)"; \
case "${ARCH}" in \
aarch64|arm64) \
- ESUM='fb43ae1202402842559cb6223886ec1663b90ffbec48479abbcb92c92c9012eb'; \
- BINARY_URL='https://github.com/adoptium/temurin23-binaries/releases/download/jdk-23.0.2%2B7/OpenJDK23U-jdk_aarch64_linux_hotspot_23.0.2_7.tar.gz'; \
+ ESUM='18071047526ab4b53131f9bb323e8703485ae37fcb2f2c5ef0f1b7bab66d1b94'; \
+ BINARY_URL='https://github.com/adoptium/temurin24-binaries/releases/download/jdk-24%2B36/OpenJDK24U-jdk_aarch64_linux_hotspot_24_36.tar.gz'; \
;; \
amd64|x86_64) \
- ESUM='870ac8c05c6fe563e7a3878a47d0234b83c050e83651d2c47e8b822ec74512dd'; \
- BINARY_URL='https://github.com/adoptium/temurin23-binaries/releases/download/jdk-23.0.2%2B7/OpenJDK23U-jdk_x64_linux_hotspot_23.0.2_7.tar.gz'; \
+ ESUM='c340dee97b6aa215d248bc196dcac5b56e7be9b5c5d45e691344d40d5d0b171d'; \
+ BINARY_URL='https://github.com/adoptium/temurin24-binaries/releases/download/jdk-24%2B36/OpenJDK24U-jdk_x64_linux_hotspot_24_36.tar.gz'; \
;; \
*) \
echo "Unsupported arch: ${ARCH}"; \
@@ -137,7 +134,7 @@ RUN set -ex; \
RUN set -ex; \
install -d /usr/share/postgresql-common/pgdg; \
curl -o /usr/share/postgresql-common/pgdg/apt.postgresql.org.asc --fail https://www.postgresql.org/media/keys/ACCC4CF8.asc; \
- echo "deb [signed-by=/usr/share/postgresql-common/pgdg/apt.postgresql.org.asc] https://apt.postgresql.org/pub/repos/apt bookworm-pgdg main" >> /etc/apt/sources.list.d/postgresql.list; \
+ echo "deb [signed-by=/usr/share/postgresql-common/pgdg/apt.postgresql.org.asc] https://apt.postgresql.org/pub/repos/apt noble-pgdg main" >> /etc/apt/sources.list.d/postgresql.list; \
apt-get -qq update; \
apt-get -qqy install postgresql-client-16; \
rm -rf /var/lib/apt/lists/*;
@@ -273,8 +270,8 @@ WORKDIR /usr/local
RUN set -eux; \
git clone https://github.com/emscripten-core/emsdk.git; \
cd emsdk; \
- ./emsdk install latest; \
- ./emsdk activate latest; \
+ ./emsdk install $EMSCRIPTEN_VERSION; \
+ ./emsdk activate $EMSCRIPTEN_VERSION; \
rustup target add wasm32-unknown-emscripten;
WORKDIR /home
diff --git a/docker/devenv/docker-compose.yaml b/docker/devenv/docker-compose.yaml
index ff2e8dcf61..796618e9c2 100644
--- a/docker/devenv/docker-compose.yaml
+++ b/docker/devenv/docker-compose.yaml
@@ -68,7 +68,7 @@ services:
- PENPOT_LDAP_ATTRS_PHOTO=jpegPhoto
minio:
- image: "minio/minio:RELEASE.2023-11-11T08-14-41Z"
+ image: "minio/minio:RELEASE.2025-04-03T14-56-28Z"
command: minio server /mnt/data --console-address ":9001"
volumes:
@@ -83,7 +83,7 @@ services:
- 9001:9001
postgres:
- image: postgres:16
+ image: postgres:16.8
command: postgres -c config_file=/etc/postgresql.conf
restart: always
stop_signal: SIGINT
diff --git a/exporter/package.json b/exporter/package.json
index 7ab00e7701..0361d3b1e5 100644
--- a/exporter/package.json
+++ b/exporter/package.json
@@ -18,7 +18,7 @@
"luxon": "^3.5.0",
"playwright": "^1.50.0",
"raw-body": "^3.0.0",
- "svgo": "penpot/svgo#v3",
+ "svgo": "penpot/svgo#v3.1",
"xml-js": "^1.6.11",
"xregexp": "^5.1.1"
},
diff --git a/exporter/yarn.lock b/exporter/yarn.lock
index 2364d4cea6..3c86f61390 100644
--- a/exporter/yarn.lock
+++ b/exporter/yarn.lock
@@ -620,13 +620,13 @@ __metadata:
languageName: node
linkType: hard
-"css-tree@npm:^3.0.0":
- version: 3.0.0
- resolution: "css-tree@npm:3.0.0"
+"css-tree@npm:^3.1.0":
+ version: 3.1.0
+ resolution: "css-tree@npm:3.1.0"
dependencies:
- mdn-data: "npm:2.10.0"
+ mdn-data: "npm:2.12.2"
source-map-js: "npm:^1.0.1"
- checksum: 10c0/43d44fdf7004ae91d73d486f17894fef77efa33747a6752b9241cf0f5fb47fabc16ec34a96a993651d9014dfdeee803d7c5fcd3548214252ee19f4e5c98999b2
+ checksum: 10c0/b5715852c2f397c715ca00d56ec53fc83ea596295ae112eb1ba6a1bda3b31086380e596b1d8c4b980fe6da09e7d0fc99c64d5bb7313030dd0fba9c1415f30979
languageName: node
linkType: hard
@@ -898,7 +898,7 @@ __metadata:
raw-body: "npm:^3.0.0"
shadow-cljs: "npm:2.28.20"
source-map-support: "npm:^0.5.21"
- svgo: "penpot/svgo#v3"
+ svgo: "penpot/svgo#v3.1"
xml-js: "npm:^1.6.11"
xregexp: "npm:^5.1.1"
languageName: unknown
@@ -1383,10 +1383,10 @@ __metadata:
languageName: node
linkType: hard
-"mdn-data@npm:2.10.0":
- version: 2.10.0
- resolution: "mdn-data@npm:2.10.0"
- checksum: 10c0/f6f1a6a6eb092bab250d06f6f6c7cb1733a77a17e7119aac829ad67d4322bbf6a30df3c6d88686e71942e66bd49274b2ddfede22a1d3df0d6c49a56fbd09eb7c
+"mdn-data@npm:2.12.2":
+ version: 2.12.2
+ resolution: "mdn-data@npm:2.12.2"
+ checksum: 10c0/b22443b71d70f72ccc3c6ba1608035431a8fc18c3c8fc53523f06d20e05c2ac10f9b53092759a2ca85cf02f0d37036f310b581ce03e7b99ac74d388ef8152ade
languageName: node
linkType: hard
@@ -2286,16 +2286,16 @@ __metadata:
languageName: node
linkType: hard
-"svgo@penpot/svgo#v3":
+"svgo@penpot/svgo#v3.1":
version: 4.0.0
- resolution: "svgo@https://github.com/penpot/svgo.git#commit=71c0db44c3c2665f2ffc0c4c5383acaebd5c524f"
+ resolution: "svgo@https://github.com/penpot/svgo.git#commit=a46262c12c0d967708395972c374eb2adead4180"
dependencies:
"@trysound/sax": "npm:0.2.0"
css-select: "npm:^5.1.0"
- css-tree: "npm:^3.0.0"
+ css-tree: "npm:^3.1.0"
csso: "npm:^5.0.5"
lodash: "npm:^4.17.21"
- checksum: 10c0/642c583372a610e484382cbf8a8fe28256dd354598d2e65ade2a3a63bf841b4d3dab4106f929f183ae3610007db2fc1413e82acc23793fe1a2e882bc923acc72
+ checksum: 10c0/87a51a0cd1168a31c07ddfa9ffa544d0cad1412b3549dc20146143a179c66e36420a88ae40221cdb23146775876d684b47972663b08b3f62335eb4f98773677e
languageName: node
linkType: hard
diff --git a/frontend/deps.edn b/frontend/deps.edn
index f0855a69cd..24ea5efa50 100644
--- a/frontend/deps.edn
+++ b/frontend/deps.edn
@@ -49,6 +49,6 @@
cider/cider-nrepl {:mvn/version "0.48.0"}}}
:shadow-cljs
- {:main-opts ["-m" "shadow.cljs.devtools.cli"]}
-
+ {:main-opts ["-m" "shadow.cljs.devtools.cli"]
+ :jvm-opts ["--sun-misc-unsafe-memory-access=allow" "-Dpenpot.wasm.profile-marks=true"]}
}}
diff --git a/frontend/package.json b/frontend/package.json
index ba740928eb..983eb966ca 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -103,9 +103,9 @@
"@penpot/draft-js": "portal:./vendor/draft-js",
"@penpot/hljs": "portal:./vendor/hljs",
"@penpot/mousetrap": "portal:./vendor/mousetrap",
- "@penpot/svgo": "penpot/svgo#c6fba7a4dcfbc27b643e7fc0c94fc98cf680b77b",
+ "@penpot/svgo": "penpot/svgo#v3.1",
"@penpot/text-editor": "portal:./text-editor",
- "@tokens-studio/sd-transforms": "^0.16.1",
+ "@tokens-studio/sd-transforms": "1.2.11",
"compression": "^1.7.5",
"date-fns": "^4.1.0",
"eventsource-parser": "^3.0.0",
@@ -124,7 +124,7 @@
"rxjs": "8.0.0-alpha.14",
"sax": "^1.4.1",
"source-map-support": "^0.5.21",
- "style-dictionary": "4.0.0-prerelease.36",
+ "style-dictionary": "5.0.0-rc.1",
"tdigest": "^0.1.2",
"tinycolor2": "^1.6.0",
"ua-parser-js": "2.0.0",
diff --git a/frontend/playwright/data/get-teams-render-wasm.json b/frontend/playwright/data/get-teams-render-wasm.json
new file mode 100644
index 0000000000..589e3d160a
--- /dev/null
+++ b/frontend/playwright/data/get-teams-render-wasm.json
@@ -0,0 +1,26 @@
+[
+ {
+ "~:features": {
+ "~#set": [
+ "render-wasm",
+ "layout/grid",
+ "styles/v2",
+ "fdata/pointer-map",
+ "fdata/objects-map",
+ "components/v2",
+ "fdata/shape-data-type"
+ ]
+ },
+ "~:permissions": {
+ "~:type": "~:membership",
+ "~:is-owner": true,
+ "~:is-admin": true,
+ "~:can-edit": true
+ },
+ "~:name": "Default",
+ "~:modified-at": "~m1713533116375",
+ "~:id": "~uc7ce0794-0992-8105-8004-38e630f7920a",
+ "~:created-at": "~m1713533116375",
+ "~:is-default": true
+ }
+]
diff --git a/frontend/playwright/data/get-teams-variants.json b/frontend/playwright/data/get-teams-variants.json
new file mode 100644
index 0000000000..50b323d047
--- /dev/null
+++ b/frontend/playwright/data/get-teams-variants.json
@@ -0,0 +1,26 @@
+[
+ {
+ "~:features": {
+ "~#set": [
+ "variants/v1",
+ "layout/grid",
+ "styles/v2",
+ "fdata/pointer-map",
+ "fdata/objects-map",
+ "components/v2",
+ "fdata/shape-data-type"
+ ]
+ },
+ "~:permissions": {
+ "~:type": "~:membership",
+ "~:is-owner": true,
+ "~:is-admin": true,
+ "~:can-edit": true
+ },
+ "~:name": "Default",
+ "~:modified-at": "~m1713533116375",
+ "~:id": "~uc7ce0794-0992-8105-8004-38e630f7920a",
+ "~:created-at": "~m1713533116375",
+ "~:is-default": true
+ }
+]
\ No newline at end of file
diff --git a/frontend/playwright/data/workspace/get-file-tokens.json b/frontend/playwright/data/workspace/get-file-tokens.json
index 84143b7a4e..d10f306b4c 100644
--- a/frontend/playwright/data/workspace/get-file-tokens.json
+++ b/frontend/playwright/data/workspace/get-file-tokens.json
@@ -53,7 +53,7 @@
{
"~#penpot/token-set": {
"~:name": "core",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498283",
"~:tokens": {
"~#ordered-map": [
@@ -64,7 +64,7 @@
"~:name": "colors.red.600",
"~:type": "~:color",
"~:value": "#e53e3e",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -76,7 +76,7 @@
"~:name": "colors.white",
"~:type": "~:color",
"~:value": "#ffffff",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -88,7 +88,7 @@
"~:name": "colors.pink.400",
"~:type": "~:color",
"~:value": "#f687b3",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -100,7 +100,7 @@
"~:name": "colors.blue.300",
"~:type": "~:color",
"~:value": "#90cdf4",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -112,7 +112,7 @@
"~:name": "colors.red.700",
"~:type": "~:color",
"~:value": "#c53030",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -124,7 +124,7 @@
"~:name": "colors.pink.800",
"~:type": "~:color",
"~:value": "#97266d",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -136,7 +136,7 @@
"~:name": "colors.green.100",
"~:type": "~:color",
"~:value": "#f0fff4",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -148,7 +148,7 @@
"~:name": "colors.blue.100",
"~:type": "~:color",
"~:value": "#ebf8ff",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -160,7 +160,7 @@
"~:name": "colors.green.800",
"~:type": "~:color",
"~:value": "#276749",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498280"
}
}
@@ -172,7 +172,7 @@
"~:name": "colors.indigo.500",
"~:type": "~:color",
"~:value": "#667eea",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -184,7 +184,7 @@
"~:name": "dimension.sm",
"~:type": "~:dimensions",
"~:value": "{dimension.xs} * {dimension.scale}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498276"
}
}
@@ -196,7 +196,7 @@
"~:name": "colors.purple.900",
"~:type": "~:color",
"~:value": "#44337a",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -208,7 +208,7 @@
"~:name": "colors.orange.200",
"~:type": "~:color",
"~:value": "#feebc8",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -220,7 +220,7 @@
"~:name": "colors.teal.700",
"~:type": "~:color",
"~:value": "#2c7a7b",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -232,7 +232,7 @@
"~:name": "colors.green.300",
"~:type": "~:color",
"~:value": "#9ae6b4",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -244,7 +244,7 @@
"~:name": "colors.pink.600",
"~:type": "~:color",
"~:value": "#d53f8c",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -256,7 +256,7 @@
"~:name": "colors.yellow.200",
"~:type": "~:color",
"~:value": "#fefcbf",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -268,7 +268,7 @@
"~:name": "colors.yellow.800",
"~:type": "~:color",
"~:value": "#975a16",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -280,7 +280,7 @@
"~:name": "colors.teal.200",
"~:type": "~:color",
"~:value": "#b2f5ea",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -292,7 +292,7 @@
"~:name": "colors.teal.500",
"~:type": "~:color",
"~:value": "#38b2ac",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -304,7 +304,7 @@
"~:name": "colors.blue.200",
"~:type": "~:color",
"~:value": "#bee3f8",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -316,7 +316,7 @@
"~:name": "colors.green.600",
"~:type": "~:color",
"~:value": "#38a169",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -328,7 +328,7 @@
"~:name": "colors.indigo.400",
"~:type": "~:color",
"~:value": "#7f9cf5",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -340,7 +340,7 @@
"~:name": "colors.purple.600",
"~:type": "~:color",
"~:value": "#805ad5",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -352,7 +352,7 @@
"~:name": "colors.purple.400",
"~:type": "~:color",
"~:value": "#b794f4",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -364,7 +364,7 @@
"~:name": "colors.indigo.900",
"~:type": "~:color",
"~:value": "#3c366b",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -376,7 +376,7 @@
"~:name": "spacing.lg",
"~:type": "~:spacing",
"~:value": "{dimension.lg}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -388,7 +388,7 @@
"~:name": "colors.purple.300",
"~:type": "~:color",
"~:value": "#d6bcfa",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -400,7 +400,7 @@
"~:name": "colors.yellow.500",
"~:type": "~:color",
"~:value": "#ecc94b",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -412,7 +412,7 @@
"~:name": "opacity.md",
"~:type": "~:opacity",
"~:value": "50%",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498283"
}
}
@@ -424,7 +424,7 @@
"~:name": "colors.purple.800",
"~:type": "~:color",
"~:value": "#553c9a",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -436,7 +436,7 @@
"~:name": "colors.yellow.900",
"~:type": "~:color",
"~:value": "#744210",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -448,7 +448,7 @@
"~:name": "dimension.xl",
"~:type": "~:dimensions",
"~:value": "{dimension.lg} * {dimension.scale}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498276"
}
}
@@ -460,7 +460,7 @@
"~:name": "colors.yellow.700",
"~:type": "~:color",
"~:value": "#b7791f",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -472,7 +472,7 @@
"~:name": "colors.green.900",
"~:type": "~:color",
"~:value": "#22543d",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498280"
}
}
@@ -484,7 +484,7 @@
"~:name": "spacing.md",
"~:type": "~:spacing",
"~:value": "{dimension.md}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -496,7 +496,7 @@
"~:name": "colors.red.200",
"~:type": "~:color",
"~:value": "#fed7d7",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -508,7 +508,7 @@
"~:name": "colors.orange.600",
"~:type": "~:color",
"~:value": "#dd6b20",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -520,7 +520,7 @@
"~:name": "dimension.scale",
"~:type": "~:dimensions",
"~:value": "2",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498276"
}
}
@@ -532,7 +532,7 @@
"~:name": "colors.red.800",
"~:type": "~:color",
"~:value": "#9b2c2c",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -544,7 +544,7 @@
"~:name": "colors.red.300",
"~:type": "~:color",
"~:value": "#feb2b2",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -556,7 +556,7 @@
"~:name": "dimension.md",
"~:type": "~:dimensions",
"~:value": "{dimension.sm} * {dimension.scale}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498276"
}
}
@@ -568,7 +568,7 @@
"~:name": "colors.gray.600",
"~:type": "~:color",
"~:value": "#718096",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -580,7 +580,7 @@
"~:name": "colors.pink.100",
"~:type": "~:color",
"~:value": "#fff5f7",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -592,7 +592,7 @@
"~:name": "colors.yellow.300",
"~:type": "~:color",
"~:value": "#faf089",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -604,7 +604,7 @@
"~:name": "colors.orange.800",
"~:type": "~:color",
"~:value": "#9c4221",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -616,7 +616,7 @@
"~:name": "colors.indigo.700",
"~:type": "~:color",
"~:value": "#4c51bf",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -628,7 +628,7 @@
"~:name": "colors.yellow.400",
"~:type": "~:color",
"~:value": "#f6e05e",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -640,7 +640,7 @@
"~:name": "opacity.low",
"~:type": "~:opacity",
"~:value": "10%",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498283"
}
}
@@ -652,7 +652,7 @@
"~:name": "colors.indigo.200",
"~:type": "~:color",
"~:value": "#c3dafe",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -664,7 +664,7 @@
"~:name": "colors.blue.900",
"~:type": "~:color",
"~:value": "#2a4365",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -676,7 +676,7 @@
"~:name": "colors.gray.500",
"~:type": "~:color",
"~:value": "#a0aec0",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -688,7 +688,7 @@
"~:name": "colors.red.400",
"~:type": "~:color",
"~:value": "#fc8181",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -700,7 +700,7 @@
"~:name": "colors.teal.800",
"~:type": "~:color",
"~:value": "#285e61",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -712,7 +712,7 @@
"~:name": "colors.gray.300",
"~:type": "~:color",
"~:value": "#e2e8f0",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -724,7 +724,7 @@
"~:name": "colors.teal.600",
"~:type": "~:color",
"~:value": "#319795",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -736,7 +736,7 @@
"~:name": "colors.red.500",
"~:type": "~:color",
"~:value": "#f56565",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -748,7 +748,7 @@
"~:name": "colors.teal.400",
"~:type": "~:color",
"~:value": "#4fd1c5",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -760,7 +760,7 @@
"~:name": "borderRadius.lg",
"~:type": "~:border-radius",
"~:value": "8",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -772,7 +772,7 @@
"~:name": "colors.gray.200",
"~:type": "~:color",
"~:value": "#edf2f7",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -784,7 +784,7 @@
"~:name": "colors.red.900",
"~:type": "~:color",
"~:value": "#742a2a",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -796,7 +796,7 @@
"~:name": "colors.gray.900",
"~:type": "~:color",
"~:value": "#1a202c",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -808,7 +808,7 @@
"~:name": "colors.pink.700",
"~:type": "~:color",
"~:value": "#b83280",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -820,7 +820,7 @@
"~:name": "colors.green.200",
"~:type": "~:color",
"~:value": "#c6f6d5",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -832,7 +832,7 @@
"~:name": "colors.pink.500",
"~:type": "~:color",
"~:value": "#ed64a6",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -844,7 +844,7 @@
"~:name": "colors.yellow.600",
"~:type": "~:color",
"~:value": "#d69e2e",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -856,7 +856,7 @@
"~:name": "colors.orange.700",
"~:type": "~:color",
"~:value": "#c05621",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -868,7 +868,7 @@
"~:name": "colors.teal.100",
"~:type": "~:color",
"~:value": "#e6fffa",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498280"
}
}
@@ -880,7 +880,7 @@
"~:name": "colors.gray.800",
"~:type": "~:color",
"~:value": "#2d3748",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -892,7 +892,7 @@
"~:name": "colors.orange.300",
"~:type": "~:color",
"~:value": "#fbd38d",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -904,7 +904,7 @@
"~:name": "colors.orange.100",
"~:type": "~:color",
"~:value": "#fffaf0",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -916,7 +916,7 @@
"~:name": "colors.purple.700",
"~:type": "~:color",
"~:value": "#6b46c1",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -928,7 +928,7 @@
"~:name": "dimension.lg",
"~:type": "~:dimensions",
"~:value": "{dimension.md} * {dimension.scale}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498276"
}
}
@@ -940,7 +940,7 @@
"~:name": "colors.gray.400",
"~:type": "~:color",
"~:value": "#cbd5e0",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -952,7 +952,7 @@
"~:name": "colors.indigo.100",
"~:type": "~:color",
"~:value": "#ebf4ff",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -964,7 +964,7 @@
"~:name": "colors.green.500",
"~:type": "~:color",
"~:value": "#48bb78",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -976,7 +976,7 @@
"~:name": "colors.pink.300",
"~:type": "~:color",
"~:value": "#fbb6ce",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -988,7 +988,7 @@
"~:name": "colors.pink.900",
"~:type": "~:color",
"~:value": "#702459",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -1000,7 +1000,7 @@
"~:name": "colors.purple.200",
"~:type": "~:color",
"~:value": "#e9d8fd",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -1012,7 +1012,7 @@
"~:name": "colors.purple.500",
"~:type": "~:color",
"~:value": "#9f7aea",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -1024,7 +1024,7 @@
"~:name": "colors.green.700",
"~:type": "~:color",
"~:value": "#2f855a",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -1036,7 +1036,7 @@
"~:name": "colors.indigo.800",
"~:type": "~:color",
"~:value": "#434190",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -1048,7 +1048,7 @@
"~:name": "colors.blue.700",
"~:type": "~:color",
"~:value": "#2b6cb0",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -1060,7 +1060,7 @@
"~:name": "borderRadius.sm",
"~:type": "~:border-radius",
"~:value": "4",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -1072,7 +1072,7 @@
"~:name": "colors.black",
"~:type": "~:color",
"~:value": "#000000",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -1084,7 +1084,7 @@
"~:name": "opacity.high",
"~:type": "~:opacity",
"~:value": "90%",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498283"
}
}
@@ -1096,7 +1096,7 @@
"~:name": "colors.blue.800",
"~:type": "~:color",
"~:value": "#2c5282",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -1108,7 +1108,7 @@
"~:name": "colors.orange.400",
"~:type": "~:color",
"~:value": "#f6ad55",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -1120,7 +1120,7 @@
"~:name": "colors.pink.200",
"~:type": "~:color",
"~:value": "#fed7e2",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -1132,7 +1132,7 @@
"~:name": "colors.gray.100",
"~:type": "~:color",
"~:value": "#f7fafc",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -1144,7 +1144,7 @@
"~:name": "spacing.xl",
"~:type": "~:spacing",
"~:value": "{dimension.xl}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -1156,7 +1156,7 @@
"~:name": "dimension.xs",
"~:type": "~:dimensions",
"~:value": "4",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498276"
}
}
@@ -1168,7 +1168,7 @@
"~:name": "colors.teal.900",
"~:type": "~:color",
"~:value": "#234e52",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -1180,7 +1180,7 @@
"~:name": "colors.teal.300",
"~:type": "~:color",
"~:value": "#81e6d9",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -1192,7 +1192,7 @@
"~:name": "colors.blue.500",
"~:type": "~:color",
"~:value": "#4299e1",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -1204,7 +1204,7 @@
"~:name": "borderRadius.xl",
"~:type": "~:border-radius",
"~:value": "16",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -1216,7 +1216,7 @@
"~:name": "colors.green.400",
"~:type": "~:color",
"~:value": "#68d391",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -1228,7 +1228,7 @@
"~:name": "colors.indigo.300",
"~:type": "~:color",
"~:value": "#a3bffa",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -1240,7 +1240,7 @@
"~:name": "colors.red.100",
"~:type": "~:color",
"~:value": "#fff5f5",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -1252,7 +1252,7 @@
"~:name": "colors.orange.900",
"~:type": "~:color",
"~:value": "#7b341e",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -1264,7 +1264,7 @@
"~:name": "colors.purple.100",
"~:type": "~:color",
"~:value": "#faf5ff",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -1276,7 +1276,7 @@
"~:name": "spacing.xs",
"~:type": "~:spacing",
"~:value": "{dimension.xs}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498276"
}
}
@@ -1288,7 +1288,7 @@
"~:name": "colors.indigo.600",
"~:type": "~:color",
"~:value": "#5a67d8",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498282"
}
}
@@ -1300,7 +1300,7 @@
"~:name": "colors.gray.700",
"~:type": "~:color",
"~:value": "#4a5568",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -1312,7 +1312,7 @@
"~:name": "colors.blue.400",
"~:type": "~:color",
"~:value": "#63b3ed",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -1324,7 +1324,7 @@
"~:name": "spacing.sm",
"~:type": "~:spacing",
"~:value": "{dimension.sm}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498277"
}
}
@@ -1336,7 +1336,7 @@
"~:name": "colors.orange.500",
"~:type": "~:color",
"~:value": "#ed8936",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498278"
}
}
@@ -1348,7 +1348,7 @@
"~:name": "colors.yellow.100",
"~:type": "~:color",
"~:value": "#fffff0",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498279"
}
}
@@ -1360,7 +1360,7 @@
"~:name": "colors.blue.600",
"~:type": "~:color",
"~:value": "#3182ce",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498281"
}
}
@@ -1379,7 +1379,7 @@
{
"~#penpot/token-set": {
"~:name": "LightDark/light",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498290",
"~:tokens": {
"~#ordered-map": [
@@ -1390,7 +1390,7 @@
"~:name": "accent.default",
"~:type": "~:color",
"~:value": "{colors.indigo.400}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498290"
}
}
@@ -1402,7 +1402,7 @@
"~:name": "bg.muted",
"~:type": "~:color",
"~:value": "{colors.gray.100}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498290"
}
}
@@ -1414,7 +1414,7 @@
"~:name": "bg.subtle",
"~:type": "~:color",
"~:value": "{colors.gray.200}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498290"
}
}
@@ -1426,7 +1426,7 @@
"~:name": "accent.bg",
"~:type": "~:color",
"~:value": "{colors.indigo.200}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498290"
}
}
@@ -1438,7 +1438,7 @@
"~:name": "accent.onAccent",
"~:type": "~:color",
"~:value": "{colors.white}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498290"
}
}
@@ -1450,7 +1450,7 @@
"~:name": "shadows.default",
"~:type": "~:color",
"~:value": "{colors.gray.900}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498290"
}
}
@@ -1462,7 +1462,7 @@
"~:name": "fg.muted",
"~:type": "~:color",
"~:value": "{colors.gray.700}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498289"
}
}
@@ -1474,7 +1474,7 @@
"~:name": "fg.default",
"~:type": "~:color",
"~:value": "{colors.black}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498289"
}
}
@@ -1486,7 +1486,7 @@
"~:name": "fg.subtle",
"~:type": "~:color",
"~:value": "{colors.gray.500}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498290"
}
}
@@ -1498,7 +1498,7 @@
"~:name": "bg.default",
"~:type": "~:color",
"~:value": "{colors.white}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498290"
}
}
@@ -1514,7 +1514,7 @@
{
"~#penpot/token-set": {
"~:name": "LightDark/dark",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291",
"~:tokens": {
"~#ordered-map": [
@@ -1525,7 +1525,7 @@
"~:name": "accent.default",
"~:type": "~:color",
"~:value": "{colors.indigo.600}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1537,7 +1537,7 @@
"~:name": "bg.muted",
"~:type": "~:color",
"~:value": "{colors.gray.700}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1549,7 +1549,7 @@
"~:name": "bg.subtle",
"~:type": "~:color",
"~:value": "{colors.gray.600}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1561,7 +1561,7 @@
"~:name": "accent.bg",
"~:type": "~:color",
"~:value": "{colors.indigo.800}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1573,7 +1573,7 @@
"~:name": "accent.onAccent",
"~:type": "~:color",
"~:value": "{colors.white}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1585,7 +1585,7 @@
"~:name": "shadows.default",
"~:type": "~:color",
"~:value": "rgba({colors.black}, 0.3)",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1597,7 +1597,7 @@
"~:name": "fg.muted",
"~:type": "~:color",
"~:value": "{colors.gray.300}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1609,7 +1609,7 @@
"~:name": "fg.default",
"~:type": "~:color",
"~:value": "{colors.white}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1621,7 +1621,7 @@
"~:name": "fg.subtle",
"~:type": "~:color",
"~:value": "{colors.gray.500}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1633,7 +1633,7 @@
"~:name": "bg.default",
"~:type": "~:color",
"~:value": "{colors.gray.900}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498291"
}
}
@@ -1651,7 +1651,7 @@
{
"~#penpot/token-set": {
"~:name": "theme",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498292",
"~:tokens": {
"~#ordered-map": [
@@ -1662,7 +1662,7 @@
"~:name": "button.primary.background",
"~:type": "~:color",
"~:value": "{accent.default}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498292"
}
}
@@ -1674,7 +1674,7 @@
"~:name": "button.primary.text",
"~:type": "~:color",
"~:value": "{accent.onAccent}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498292"
}
}
@@ -1686,7 +1686,7 @@
"~:name": "button.borderRadius",
"~:type": "~:border-radius",
"~:value": "{borderRadius.lg}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498292"
}
}
@@ -1698,7 +1698,7 @@
"~:name": "card.borderRadius",
"~:type": "~:border-radius",
"~:value": "{borderRadius.lg}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498292"
}
}
@@ -1710,7 +1710,7 @@
"~:name": "card.background",
"~:type": "~:color",
"~:value": "{bg.default}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498292"
}
}
@@ -1722,7 +1722,7 @@
"~:name": "card.padding",
"~:type": "~:dimensions",
"~:value": "{dimension.md}",
- "~:description": null,
+ "~:description": "",
"~:modified-at": "~m1737542498292"
}
}
@@ -1746,7 +1746,7 @@
"~#penpot/token-theme": {
"~:name": "Light",
"~:group": "Core",
- "~:description": null,
+ "~:description": "",
"~:is-source": false,
"~:id": "core-light",
"~:modified-at": "~m1737542746842",
@@ -1762,7 +1762,7 @@
"~#penpot/token-theme": {
"~:name": "Dark",
"~:group": "Core",
- "~:description": null,
+ "~:description": "",
"~:is-source": false,
"~:id": "core-dark",
"~:modified-at": "~m1737542746842",
@@ -1785,7 +1785,7 @@
"~#penpot/token-theme": {
"~:name": "__PENPOT__HIDDEN__TOKEN__THEME__",
"~:group": "",
- "~:description": null,
+ "~:description": "",
"~:is-source": false,
"~:id": "hidden-theme",
"~:modified-at": "~m1737542683555",
diff --git a/frontend/playwright/data/workspace/get-team-variants.json b/frontend/playwright/data/workspace/get-team-variants.json
new file mode 100644
index 0000000000..2ac6097bdc
--- /dev/null
+++ b/frontend/playwright/data/workspace/get-team-variants.json
@@ -0,0 +1,24 @@
+{
+ "~:features": {
+ "~#set": [
+ "variants/v1",
+ "layout/grid",
+ "styles/v2",
+ "fdata/pointer-map",
+ "fdata/objects-map",
+ "components/v2",
+ "fdata/shape-data-type"
+ ]
+ },
+ "~:permissions": {
+ "~:type": "~:membership",
+ "~:is-owner": true,
+ "~:is-admin": true,
+ "~:can-edit": true
+ },
+ "~:name": "Default",
+ "~:modified-at": "~m1713533116375",
+ "~:id": "~uc7ce0794-0992-8105-8004-38e630f40f6d",
+ "~:created-at": "~m1713533116375",
+ "~:is-default": true
+}
\ No newline at end of file
diff --git a/frontend/playwright/ui/pages/WorkspacePage.js b/frontend/playwright/ui/pages/WorkspacePage.js
index 3fc9b42db0..6e79fa686a 100644
--- a/frontend/playwright/ui/pages/WorkspacePage.js
+++ b/frontend/playwright/ui/pages/WorkspacePage.js
@@ -70,6 +70,7 @@ export class WorkspacePage extends BaseWebSocketPage {
);
this.toolbarOptions = page.getByTestId("toolbar-options");
this.rectShapeButton = page.getByRole("button", { name: "Rectangle (R)" });
+ this.ellipseShapeButton = page.getByRole("button", { name: "Ellipse (E)" });
this.moveButton = page.getByRole("button", { name: "Move (V)" });
this.boardButton = page.getByRole("button", { name: "Board (B)" });
this.toggleToolbarButton = page.getByRole("button", {
@@ -198,6 +199,13 @@ export class WorkspacePage extends BaseWebSocketPage {
await this.page.mouse.up();
}
+ async clickAt(x, y) {
+ await this.page.waitForTimeout(100);
+ await this.viewport.hover({ position: { x, y } });
+ await this.page.mouse.down();
+ await this.page.mouse.up();
+ }
+
async panOnViewportAt(x, y, width, height) {
await this.page.waitForTimeout(100);
await this.viewport.hover({ position: { x, y } });
diff --git a/frontend/playwright/ui/specs/render-wasm.spec.js b/frontend/playwright/ui/specs/render-wasm.spec.js
new file mode 100644
index 0000000000..abf8fae464
--- /dev/null
+++ b/frontend/playwright/ui/specs/render-wasm.spec.js
@@ -0,0 +1,23 @@
+import { test, expect } from "@playwright/test";
+import { WorkspacePage } from "../pages/WorkspacePage";
+import { BaseWebSocketPage } from "../pages/BaseWebSocketPage";
+
+test.beforeEach(async ({ page }) => {
+ await WorkspacePage.init(page);
+ await BaseWebSocketPage.mockRPC(
+ page,
+ "get-teams",
+ "get-teams-render-wasm.json",
+ );
+});
+
+test("BUG 10867 - Crash when loading comments", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await workspacePage.setupEmptyFile();
+ await workspacePage.goToWorkspace();
+
+ await workspacePage.showComments();
+ await expect(
+ workspacePage.rightSidebar.getByText("Show all comments"),
+ ).toBeVisible();
+});
diff --git a/frontend/playwright/ui/specs/tokens.spec.js b/frontend/playwright/ui/specs/tokens.spec.js
index 73e8488316..e717b77e36 100644
--- a/frontend/playwright/ui/specs/tokens.spec.js
+++ b/frontend/playwright/ui/specs/tokens.spec.js
@@ -371,6 +371,59 @@ test.describe("Tokens: Tokens Tab", () => {
await expect(tokensTabPanel.getByLabel("color.dark.primary")).toBeEnabled();
});
+ test("User changes color token color while keeping custom color space", async ({
+ page,
+ }) => {
+ const { workspacePage, tokensUpdateCreateModal, tokenThemesSetsSidebar } =
+ await setupEmptyTokensFile(page);
+
+ const tokensTabPanel = page.getByRole("tabpanel", { name: "tokens" });
+ await tokensTabPanel.getByTitle("Add token: Color").click();
+
+ await expect(tokensUpdateCreateModal).toBeVisible();
+ const nameField = tokensUpdateCreateModal.getByLabel("Name");
+ const valueField = tokensUpdateCreateModal.getByLabel("Value");
+
+ await valueField.click();
+ await valueField.fill("hsv(1,1,1)");
+ await expect(
+ tokensUpdateCreateModal.getByText("Resolved value: #ff0400"),
+ ).toBeVisible();
+
+ const colorBullet = tokensUpdateCreateModal.getByTestId(
+ "token-form-color-bullet",
+ );
+ await colorBullet.click();
+
+ const valueSaturationSelector = tokensUpdateCreateModal.getByTestId(
+ "value-saturation-selector",
+ );
+ await expect(valueSaturationSelector).toBeVisible();
+
+ // Check if color space doesnt get overwritten when changing color via the picker
+ // Not testing for exact value to avoid flakiness of px click
+ await valueSaturationSelector.click({ position: { x: 100, y: 100 } });
+ await expect(valueField).not.toHaveValue("hsv(1,1,1)");
+ await expect(valueField).toHaveValue(/^hsv.*$/);
+
+ // Clearing the input field should pick hex
+ await valueField.fill("");
+ await expect(
+ tokensUpdateCreateModal.getByText("Resolved value: -"),
+ ).toBeVisible();
+ await valueSaturationSelector.click({ position: { x: 50, y: 50 } });
+ await expect(valueField).toHaveValue(/^#[A-Fa-f\d]+$/);
+
+ // Changing opacity for hex values converts to rgba
+ const sliderOpacity = tokensUpdateCreateModal.getByTestId("slider-opacity");
+ await sliderOpacity.click({ position: { x: 50, y: 0 } });
+ await expect(valueField).toHaveValue(/^rgba(.*)$/);
+
+ // Changing color now will stay in rgba
+ await valueSaturationSelector.click({ position: { x: 0, y: 0 } });
+ await expect(valueField).toHaveValue(/^rgba(.*)$/);
+ });
+
test("User duplicate color token", async ({ page }) => {
const { tokensSidebar, tokenContextMenuForToken } =
await setupTokensFile(page);
@@ -511,7 +564,9 @@ test.describe("Tokens: Sets Tab", () => {
// Creates nesting by renaming set with double click
await tokenThemesSetsSidebar
.getByRole("button", { name: "light-renamed" })
- .dblclick();
+ .click({ button: "right" });
+ await expect(tokenContextMenuForSet).toBeVisible();
+ await tokenContextMenuForSet.getByText("Rename").click();
await changeSetInput(tokenThemesSetsSidebar, "nested/light");
await assertSetsList(tokenThemesSetsSidebar, [
diff --git a/frontend/playwright/ui/specs/variants.spec.js b/frontend/playwright/ui/specs/variants.spec.js
new file mode 100644
index 0000000000..9b042341b5
--- /dev/null
+++ b/frontend/playwright/ui/specs/variants.spec.js
@@ -0,0 +1,428 @@
+import { test, expect } from "@playwright/test";
+import { WorkspacePage } from "../pages/WorkspacePage";
+import { BaseWebSocketPage } from "../pages/BaseWebSocketPage";
+
+test.beforeEach(async ({ page }) => {
+ await WorkspacePage.init(page);
+ await BaseWebSocketPage.mockRPC(page, "get-teams", "get-teams-variants.json");
+});
+
+const setupVariantsFile = async (workspacePage) => {
+ await workspacePage.setupEmptyFile();
+ await workspacePage.mockRPC(
+ "get-team?id=*",
+ "workspace/get-team-variants.json",
+ );
+
+ await workspacePage.setupEmptyFile();
+ await workspacePage.mockRPC(
+ /get\-file\?/,
+ "workspace/get-file-not-empty.json",
+ );
+ await workspacePage.mockRPC(
+ "update-file?id=*",
+ "workspace/update-file-create-rect.json",
+ );
+
+ await workspacePage.goToWorkspace({
+ fileId: "6191cd35-bb1f-81f7-8004-7cc63d087374",
+ pageId: "6191cd35-bb1f-81f7-8004-7cc63d087375",
+ });
+};
+
+const setupVariantsFileWithVariant = async (workspacePage) => {
+ await setupVariantsFile(workspacePage);
+
+ await workspacePage.clickLeafLayer("Rectangle");
+ await workspacePage.page.keyboard.press("Control+k");
+ await workspacePage.page.keyboard.press("Control+k");
+};
+
+const findVariant = async (workspacePage, num_variant) => {
+ const container = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("Rectangle") })
+ .filter({ has: workspacePage.page.locator(".icon-component") })
+ .nth(num_variant);
+
+ const variant1 = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("Value 1") })
+ .filter({ has: workspacePage.page.locator(".icon-variant") })
+ .nth(num_variant);
+
+ const variant2 = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("Value 2") })
+ .filter({ has: workspacePage.page.locator(".icon-variant") })
+ .nth(num_variant);
+
+ return {
+ container: container,
+ variant1: variant1,
+ variant2: variant2,
+ };
+};
+
+const validateVariant = async (variant) => {
+ //The variant container exists and is visible
+ await expect(variant.container).toBeVisible();
+
+ //The variants exists and are visible
+ await expect(variant.variant1).toBeVisible();
+ await expect(variant.variant2).toBeVisible();
+
+ // variant1 and variant2 are items inside the childs of variant_container
+ const parent_id = "children-" + (await variant.container.getAttribute("id"));
+ await expect(variant.variant1.locator("xpath=..")).toHaveAttribute(
+ "data-testid",
+ parent_id,
+ );
+ await expect(variant.variant2.locator("xpath=..")).toHaveAttribute(
+ "data-testid",
+ parent_id,
+ );
+};
+
+test("User creates a variant", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ await workspacePage.clickLeafLayer("Rectangle");
+
+ const variant = await findVariant(workspacePage, 0);
+ // The variant is valid
+ await validateVariant(variant);
+
+ // Extra validators
+ await variant.container.click();
+
+ const variants = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.locator(".icon-variant") })
+ .all();
+
+ // There are exactly two variants
+ expect(variants.length).toBe(2);
+
+ // The design tab shows the variant properties
+ await expect(
+ workspacePage.page.getByTitle("Property1: Value 1, Value 2"),
+ ).toBeVisible();
+});
+
+test("User duplicates a variant container", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ // Select the variant container
+ await variant.container.click();
+
+ //Duplicate the variant container
+ await workspacePage.page.keyboard.press("Control+d");
+
+ const variant_original = await findVariant(workspacePage, 1); // On duplicate, the new item is the first
+ const variant_duplicate = await findVariant(workspacePage, 0);
+
+ // Expand the layers
+ await variant_duplicate.container.getByRole("button").first().click();
+
+ // The variants are valid
+ await validateVariant(variant_original);
+ await validateVariant(variant_duplicate);
+});
+
+test("User copy paste a variant container", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ // Select the variant container
+ await variant.container.click();
+
+ //Copy the variant container
+ await workspacePage.page.keyboard.press("Control+c");
+
+ //Paste the variant container
+ await workspacePage.clickAt(500, 500);
+ await workspacePage.page.keyboard.press("Control+v");
+
+ const variant_original = await findVariant(workspacePage, 0);
+ const variant_duplicate = await findVariant(workspacePage, 1);
+
+ // Expand the layers
+ await variant_duplicate.container.getByRole("button").first().click();
+
+ // The variants are valid
+ await validateVariant(variant_original);
+ await validateVariant(variant_duplicate);
+});
+
+test("User cut paste a variant container", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ // Select the variant container
+ await variant.container.click();
+
+ //Cut the variant container
+ await workspacePage.page.keyboard.press("Control+x");
+
+ //Paste the variant container
+ await workspacePage.clickAt(500, 500);
+ await workspacePage.page.keyboard.press("Control+v");
+
+ const variant_pasted = await findVariant(workspacePage, 0);
+
+ // Expand the layers
+ await variant_pasted.container.getByRole("button").first().click();
+
+ // The variants are valid
+ await validateVariant(variant_pasted);
+});
+
+test("[Bugfixing] User cut paste a variant container into a board, and undo twice", async ({
+ page,
+}) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ //Create a board
+ await workspacePage.boardButton.click();
+ await workspacePage.clickWithDragViewportAt(500, 500, 200, 200);
+ await workspacePage.clickAt(495, 495);
+ const board = await workspacePage.rootShape.locator("Board");
+
+ // Select the variant container
+ await variant.container.click();
+
+ //Cut the variant container
+ await workspacePage.page.keyboard.press("Control+x");
+
+ //Select the board
+ await workspacePage.clickLeafLayer("Board");
+
+ //Paste the variant container inside the board
+ await workspacePage.page.keyboard.press("Control+v");
+
+ //Undo twice
+ await workspacePage.page.keyboard.press("Control+z");
+ await workspacePage.page.keyboard.press("Control+z");
+
+ const variant_after_undo = await findVariant(workspacePage, 0);
+
+ // The variants are valid
+ await validateVariant(variant_after_undo);
+});
+
+test("User copy paste a variant", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ // Select the variant1
+ await variant.variant1.click();
+
+ //Cut the variant
+ await workspacePage.page.keyboard.press("Control+c");
+
+ //Paste the variant
+ await workspacePage.clickAt(500, 500);
+ await workspacePage.page.keyboard.press("Control+v");
+
+ const copy = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("Rectangle") })
+ .filter({ has: workspacePage.page.locator(".icon-component-copy") });
+
+ //The copy exists and is visible
+ await expect(copy).toBeVisible();
+});
+
+test("User cut paste a variant outside the container", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ // Select the variant1
+ await variant.variant1.click();
+
+ //Cut the variant
+ await workspacePage.page.keyboard.press("Control+x");
+
+ //Paste the variant
+ await workspacePage.clickAt(500, 500);
+ await workspacePage.page.keyboard.press("Control+v");
+
+ const component = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("Rectangle / Value 1") })
+ .filter({ has: workspacePage.page.locator(".icon-component") });
+
+ //The component exists and is visible
+ await expect(component).toBeVisible();
+});
+
+test("User drag and drop a variant outside the container", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ // Drag and drop the variant
+ await workspacePage.clickWithDragViewportAt(350, 400, 0, 200);
+
+ const component = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("Rectangle / Value 1") })
+ .filter({ has: workspacePage.page.locator(".icon-component") });
+
+ //The component exists and is visible
+ await expect(component).toBeVisible();
+});
+
+test("User cut paste a component inside a variant", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ //Create a component
+ await workspacePage.ellipseShapeButton.click();
+ await workspacePage.clickWithDragViewportAt(500, 500, 20, 20);
+ await workspacePage.clickLeafLayer("Ellipse");
+ await workspacePage.page.keyboard.press("Control+k");
+
+ //Cut the component
+ await workspacePage.page.keyboard.press("Control+x");
+
+ //Paste the component inside the variant
+ await variant.container.click();
+ await workspacePage.page.keyboard.press("Control+v");
+
+ const variant3 = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("Ellipse") })
+ .filter({ has: workspacePage.page.locator(".icon-variant") })
+ .first();
+
+ //The new variant exists and is visible
+ await expect(variant3).toBeVisible();
+});
+
+test("User cut paste a component with path inside a variant", async ({
+ page,
+}) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ //Create a component
+ await workspacePage.ellipseShapeButton.click();
+ await workspacePage.clickWithDragViewportAt(500, 500, 20, 20);
+ await workspacePage.clickLeafLayer("Ellipse");
+ await workspacePage.page.keyboard.press("Control+k");
+
+ //Rename the component
+ await workspacePage.layers.getByText("Ellipse").dblclick();
+ await workspacePage.page
+ .getByTestId("layer-item")
+ .getByRole("textbox")
+ .pressSequentially("button / hover");
+ await workspacePage.page.keyboard.press("Enter");
+
+ //Cut the component
+ await workspacePage.page.keyboard.press("Control+x");
+
+ //Paste the component inside the variant
+ await variant.container.click();
+ await workspacePage.page.keyboard.press("Control+v");
+
+ const variant3 = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("button, hover") })
+ .filter({ has: workspacePage.page.locator(".icon-variant") })
+ .first();
+
+ //The new variant exists and is visible
+ await expect(variant3).toBeVisible();
+});
+
+test("User drag and drop a component with path inside a variant", async ({
+ page,
+}) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ const variant = await findVariant(workspacePage, 0);
+
+ //Create a component
+ await workspacePage.ellipseShapeButton.click();
+ await workspacePage.clickWithDragViewportAt(500, 500, 20, 20);
+ await workspacePage.clickLeafLayer("Ellipse");
+ await workspacePage.page.keyboard.press("Control+k");
+
+ //Rename the component
+ await workspacePage.layers.getByText("Ellipse").dblclick();
+ await workspacePage.page
+ .getByTestId("layer-item")
+ .getByRole("textbox")
+ .pressSequentially("button / hover");
+ await workspacePage.page.keyboard.press("Enter");
+
+ //Drag and drop the component the component
+ await workspacePage.clickWithDragViewportAt(510, 510, 0, -200);
+
+ const variant3 = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("button, hover") })
+ .filter({ has: workspacePage.page.locator(".icon-variant") })
+ .first();
+
+ //The new variant exists and is visible
+ await expect(variant3).toBeVisible();
+});
+
+test("User cut paste a variant into another container", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await setupVariantsFileWithVariant(workspacePage);
+
+ // Create anothe variant
+ await workspacePage.ellipseShapeButton.click();
+ await workspacePage.clickWithDragViewportAt(500, 500, 20, 20);
+ await workspacePage.clickLeafLayer("Ellipse");
+ await workspacePage.page.keyboard.press("Control+k");
+ await workspacePage.page.keyboard.press("Control+k");
+
+ const variant_origin = await findVariant(workspacePage, 1);
+ const variant_target = await findVariant(workspacePage, 0);
+
+ // Select the variant1
+ await variant_origin.variant1.click();
+
+ //Cut the variant
+ await workspacePage.page.keyboard.press("Control+x");
+
+ //Paste the variant
+ await workspacePage.layers.getByText("Ellipse").first().click();
+ await workspacePage.page.keyboard.press("Control+v");
+
+ const variant3 = await workspacePage.layers
+ .getByTestId("layer-row")
+ .filter({ has: workspacePage.page.getByText("Value 1, rectangle") })
+ .filter({ has: workspacePage.page.locator(".icon-variant") })
+ .first();
+
+ //The new variant exists and is visible
+ await expect(variant3).toBeVisible();
+});
diff --git a/frontend/playwright/ui/specs/versions.spec.js b/frontend/playwright/ui/specs/versions.spec.js
index edd8fc9ea9..dd28a74c5e 100644
--- a/frontend/playwright/ui/specs/versions.spec.js
+++ b/frontend/playwright/ui/specs/versions.spec.js
@@ -4,11 +4,13 @@ import { presenceFixture } from "../../data/workspace/ws-notifications";
test.beforeEach(async ({ page }) => {
await WorkspacePage.init(page);
+ const workspacePage = new WorkspacePage(page);
+ await workspacePage.setupEmptyFile(page);
});
test("Save and restore version", async ({ page }) => {
const workspacePage = new WorkspacePage(page);
- await workspacePage.setupEmptyFile(page);
+
await workspacePage.mockRPC(/get\-file\?/, "workspace/versions-init.json");
await workspacePage.mockRPC(
"get-file-fragment?file-id=*&fragment-id=406b7b01-d3e2-80e4-8005-3138b7cc5f0b",
@@ -87,3 +89,20 @@ test("Save and restore version", async ({ page }) => {
// check that the history panel is closed after restore
await expect(page.getByRole("tab", { name: "design" })).toBeVisible();
});
+
+test("BUG 11006 - Fix history panel shortcut", async ({ page }) => {
+ const workspacePage = new WorkspacePage(page);
+ await workspacePage.mockRPC(/get\-file\?/, "workspace/versions-init.json");
+ await workspacePage.mockRPC(
+ "get-file-snapshots?file-id=*",
+ "workspace/versions-snapshot-1.json",
+ );
+
+ await workspacePage.goToWorkspace();
+
+ await page.keyboard.press("Control+Alt+h");
+
+ await expect(
+ workspacePage.rightSidebar.getByText("There are no versions yet"),
+ ).toBeVisible();
+});
diff --git a/frontend/resources/images/features/2.7-duplicate-set.gif b/frontend/resources/images/features/2.7-duplicate-set.gif
new file mode 100644
index 0000000000..a8e2ff367a
Binary files /dev/null and b/frontend/resources/images/features/2.7-duplicate-set.gif differ
diff --git a/frontend/resources/images/features/2.7-invitations.gif b/frontend/resources/images/features/2.7-invitations.gif
new file mode 100644
index 0000000000..ca601049be
Binary files /dev/null and b/frontend/resources/images/features/2.7-invitations.gif differ
diff --git a/frontend/resources/images/features/2.7-share.gif b/frontend/resources/images/features/2.7-share.gif
new file mode 100644
index 0000000000..e983cbe4a4
Binary files /dev/null and b/frontend/resources/images/features/2.7-share.gif differ
diff --git a/frontend/resources/images/features/2.7-slide-0.jpg b/frontend/resources/images/features/2.7-slide-0.jpg
new file mode 100644
index 0000000000..1825c955ca
Binary files /dev/null and b/frontend/resources/images/features/2.7-slide-0.jpg differ
diff --git a/frontend/resources/images/icons/crown.svg b/frontend/resources/images/icons/crown.svg
new file mode 100644
index 0000000000..086dc5fa20
--- /dev/null
+++ b/frontend/resources/images/icons/crown.svg
@@ -0,0 +1,4 @@
+
+
+
\ No newline at end of file
diff --git a/frontend/resources/images/icons/eye-off.svg b/frontend/resources/images/icons/eye-off.svg
new file mode 100644
index 0000000000..00c1582b4d
--- /dev/null
+++ b/frontend/resources/images/icons/eye-off.svg
@@ -0,0 +1,3 @@
+
+
\ No newline at end of file
diff --git a/frontend/src/app/main/constants.cljs b/frontend/src/app/main/constants.cljs
index e9d3137c48..8ea2ea0cc2 100644
--- a/frontend/src/app/main/constants.cljs
+++ b/frontend/src/app/main/constants.cljs
@@ -25,6 +25,36 @@
(def size-presets
[{:name "APPLE"}
+ {:name "iPhone 16"
+ :width 393
+ :height 852}
+ {:name "iPhone 16 Pro"
+ :width 402
+ :height 874}
+ {:name "iPhone 16 Pro Max"
+ :width 440
+ :height 956}
+ {:name "iPhone 16 Plus"
+ :width 430
+ :height 932}
+ {:name "14/15 Pro Max"
+ :width 430
+ :height 932}
+ {:name "iPhone 15/15 Pro"
+ :width 393
+ :height 852}
+ {:name "iPhone 13/14 "
+ :width 390
+ :height 844}
+ {:name "iPhone 14 Plus"
+ :width 428
+ :height 926}
+ {:name "iPhone 13 Mini"
+ :width 375
+ :height 812}
+ {:name "iPhone SE"
+ :width 320
+ :height 568}
{:name "iPhone 12/12 Pro"
:width 390
:height 844}
@@ -40,47 +70,86 @@
{:name "iPhone XS Max/XR/11"
:width 414
:height 896}
- {:name "iPhone 6/7/8 Plus"
- :width 414
- :height 736}
- {:name "iPhone 6/7/8/SE2"
- :width 375
- :height 667}
- {:name "iPhone 5/SE"
- :width 320
- :height 568}
{:name "iPad"
:width 768
:height 1024}
+ {:name "iPad Mini 8.3in"
+ :width 744
+ :height 1133}
{:name "iPad Pro 10.5in"
:width 834
:height 1112}
+ {:name "iPad Pro 11in"
+ :width 834
+ :height 1194}
{:name "iPad Pro 12.9in"
- :width 1024
+ :width 1027
:height 1366}
+ {:name "Watch Series 10"
+ :width 416
+ :height 496}
+ {:name "Watch 45mm"
+ :width 396
+ :height 484}
{:name "Watch 44mm"
:width 368
:height 448}
{:name "Watch 42mm"
:width 312
:height 390}
+ {:name "Watch 41mm"
+ :width 352
+ :height 430}
{:name "Watch 40mm"
:width 324
:height 394}
{:name "Watch 38mm"
:width 272
:height 340}
+ {:name "MacBook Air"
+ :width 1280
+ :height 832}
+ {:name "MacBook Pro 14in"
+ :width 1512
+ :height 982}
+ {:name "MacBook Pro 16in"
+ :width 1728
+ :height 1117}
{:name "ANDROID"}
+ {:name "Expanded"
+ :width 1280
+ :height 800}
+ {:name "Compact"
+ :width 412
+ :height 917}
+ {:name "Large"
+ :width 360
+ :height 800}
+ {:name "Medium"
+ :width 700
+ :height 840}
+ {:name "Small"
+ :width 360
+ :height 640}
{:name "Mobile"
:width 360
:height 640}
{:name "Tablet"
:width 768
:height 1024}
+ {:name "Google Pixel 7 Pro"
+ :width 1440
+ :height 3120}
+ {:name "Google Pixel 6a/6"
+ :width 1080
+ :height 2400}
{:name "Google Pixel 4a/5"
:width 393
:height 851}
+ {:name "Samsung Galaxy S22"
+ :width 1080
+ :height 2340}
{:name "Samsung Galaxy S20+"
:width 384
:height 854}
@@ -95,11 +164,17 @@
{:name "Surface Pro 4/5/6/7"
:width 1368
:height 912}
+ {:name "Surface Pro 8"
+ :width 140
+ :height 960}
{:name "ReMarkable"}
{:name "Remarkable 2"
- :width 840
- :height 1120}
+ :width 1404
+ :height 1872}
+ {:name "Remarkable Pro"
+ :width 1620
+ :height 2160}
{:name "WEB"}
{:name "Web 1280"
@@ -115,6 +190,20 @@
:width 1920
:height 1080}
+ {:name "MIXED"}
+ {:name "Desktop/Wireframe"
+ :width 1440
+ :height 1024}
+ {:name "TV"
+ :width 1280
+ :height 720}
+ {:name "Slide 16:9"
+ :width 1920
+ :height 1080}
+ {:name "Slide 4:3"
+ :width 1027
+ :height 768}
+
{:name "PRINT (96dpi)"}
{:name "A0"
:width 3179
@@ -150,7 +239,7 @@
:height 320}
{:name "Instagram post"
:width 1080
- :height 1080}
+ :height 1350}
{:name "Instagram story"
:width 1080
:height 1920}
@@ -170,15 +259,24 @@
:width 1584
:height 396}
{:name "LinkedIn post"
- :width 1200
- :height 627}
- {:name "Twitter profile"
+ :width 520
+ :height 320}
+ {:name "Bluesky profile"
:width 400
:height 400}
- {:name "Twitter header"
+ {:name "Bluesky cover"
+ :width 3000
+ :height 1000}
+ {:name "Bluesky post"
+ :width 1080
+ :height 1350}
+ {:name "X profile"
+ :width 400
+ :height 400}
+ {:name "X header"
:width 1500
:height 500}
- {:name "Twitter post"
+ {:name "X post"
:width 1024
:height 512}
{:name "YouTube profile"
@@ -187,6 +285,9 @@
{:name "YouTube banner"
:width 2560
:height 1440}
+ {:name "YouTube cover"
+ :width 2048
+ :height 1152}
{:name "YouTube thumb"
:width 1280
:height 720}])
diff --git a/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs b/frontend/src/app/main/data/style_dictionary.cljs
similarity index 86%
rename from frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs
rename to frontend/src/app/main/data/style_dictionary.cljs
index d04ed352e9..101c0fc854 100644
--- a/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs
+++ b/frontend/src/app/main/data/style_dictionary.cljs
@@ -1,16 +1,21 @@
-(ns app.main.ui.workspace.tokens.style-dictionary
+;; 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.style-dictionary
(:require
["@tokens-studio/sd-transforms" :as sd-transforms]
["style-dictionary$default" :as sd]
+ [app.common.files.tokens :as cft]
[app.common.logging :as l]
[app.common.schema :as sm]
[app.common.transit :as t]
[app.common.types.tokens-lib :as ctob]
- [app.main.ui.workspace.tokens.errors :as wte]
- [app.main.ui.workspace.tokens.tinycolor :as tinycolor]
- [app.main.ui.workspace.tokens.token :as wtt]
- [app.main.ui.workspace.tokens.warnings :as wtw]
- [app.util.i18n :refer [tr]]
+ [app.main.data.tinycolor :as tinycolor]
+ [app.main.data.workspace.tokens.errors :as wte]
+ [app.main.data.workspace.tokens.warnings :as wtw]
[app.util.time :as dt]
[beicon.v2.core :as rx]
[cuerdas.core :as str]
@@ -25,7 +30,7 @@
"Initiates the StyleDictionary instance.
Setup transforms from tokens-studio used to parse and resolved token values."
(do
- (sd-transforms/registerTransforms sd)
+ (sd-transforms/register sd)
(.registerFormat sd #js {:name "custom/json"
:format (fn [^js res]
(.-tokens (.-dictionary res)))})
@@ -55,7 +60,7 @@
"Parses `value` of a numeric `sd-token` into a map like `{:value 1 :unit \"px\"}`.
If the `value` is not parseable and/or has missing references returns a map with `:errors`."
[value]
- (let [parsed-value (wtt/parse-token-value value)
+ (let [parsed-value (cft/parse-token-value value)
out-of-bounds (or (>= (:value parsed-value) sm/max-safe-int)
(<= (:value parsed-value) sm/min-safe-int))]
(if (and parsed-value (not out-of-bounds))
@@ -73,7 +78,7 @@
If the `value` is parseable but is out of range returns a map with `warnings`."
[value has-references?]
- (let [parsed-value (wtt/parse-token-value value)
+ (let [parsed-value (cft/parse-token-value value)
out-of-scope (not (<= 0 (:value parsed-value) 1))
references (seq (ctob/find-token-value-references value))]
(cond
@@ -99,7 +104,7 @@
If the `value` is parseable but is out of range returns a map with `warnings`."
[value has-references?]
- (let [parsed-value (wtt/parse-token-value value)
+ (let [parsed-value (cft/parse-token-value value)
out-of-scope (< (:value parsed-value) 0)
references (seq (ctob/find-token-value-references value))]
(cond
@@ -192,9 +197,11 @@
config)
(build-dictionary [_]
- (let [config' (clj->js config)]
+ (let [platform "json"
+ config' (clj->js config)]
(-> (sd. config')
- (.buildAllPlatforms "json")
+ (.buildAllPlatforms platform)
+ (p/then #(.getPlatformTokens ^js % platform))
(p/then #(.-allTokens ^js %))))))
(defn resolve-tokens-tree+
@@ -240,7 +247,21 @@
;; === Import
-(defn reference-errors
+(defn- decode-single-set-json
+ "Decodes parsed json containing single token set and converts to library"
+ [this set-name tokens]
+ (assert (map? tokens) "expected a map data structure for `data`")
+
+ (ctob/add-set this (ctob/make-token-set :name (ctob/normalize-set-name set-name)
+ :tokens (ctob/flatten-nested-tokens-json tokens ""))))
+
+(defn- decode-single-set-legacy-json
+ "Decodes parsed legacy json containing single token set and converts to library"
+ [this set-name tokens]
+ (assert (map? tokens) "expected a map data structure for `data`")
+ (decode-single-set-json this set-name (ctob/legacy-nodes->dtcg-nodes tokens)))
+
+(defn- reference-errors
"Extracts reference errors from StyleDictionary."
[err]
(let [[header-1 header-2 & errors] (str/split err "\n")]
@@ -249,6 +270,16 @@
(= header-2 "Reference Errors:"))
errors)))
+(defn name-error
+ "Extracts name error out of malli schema error during import."
+ [err]
+ (let [schema-error (some-> (ex-data err)
+ (get-in [:app.common.schema/explain :errors])
+ (first))
+ name-error? (= (:in schema-error) [:name])]
+ (when name-error?
+ (wte/error-ex-info :error.import/invalid-token-name (:value schema-error) err))))
+
(defn process-json-stream
([data-stream]
(process-json-stream nil data-stream))
@@ -267,11 +298,11 @@
(cond
(and single-set?
(= :json-format/legacy json-format))
- (ctob/decode-single-set-legacy-json (ctob/ensure-tokens-lib nil) file-name json-data)
+ (decode-single-set-legacy-json (ctob/ensure-tokens-lib nil) file-name json-data)
(and single-set?
(= :json-format/dtcg json-format))
- (ctob/decode-single-set-json (ctob/ensure-tokens-lib nil) file-name json-data)
+ (decode-single-set-json (ctob/ensure-tokens-lib nil) file-name json-data)
(= :json-format/legacy json-format)
(ctob/decode-legacy-json (ctob/ensure-tokens-lib nil) json-data)
@@ -280,7 +311,9 @@
(ctob/decode-dtcg-json (ctob/ensure-tokens-lib nil) json-data))
(catch js/Error e
- (throw (wte/error-ex-info :error.import/invalid-json-data json-data e)))))))
+ (let [err (or (name-error e)
+ (wte/error-ex-info :error.import/invalid-json-data json-data e))]
+ (throw err)))))))
(rx/mapcat (fn [tokens-lib]
(try
(-> (ctob/get-all-tokens tokens-lib)
@@ -295,17 +328,6 @@
(catch js/Error e
(p/rejected (wte/error-ex-info :error.import/style-dictionary-unknown-error "" e))))))))))
-;; === Errors
-
-(defn humanize-errors [{:keys [errors] :as token}]
- (->> (map (fn [err]
- (case (:error/code err)
- ;; TODO: This needs translations
- :error.style-dictionary/missing-reference (tr "workspace.token.token-not-resolved" (:error/value err))
- nil))
- errors)
- (str/join "\n")))
-
;; === Hooks
(defonce !tokens-cache (atom nil))
diff --git a/frontend/src/app/main/ui/workspace/tokens/tinycolor.cljs b/frontend/src/app/main/data/tinycolor.cljs
similarity index 66%
rename from frontend/src/app/main/ui/workspace/tokens/tinycolor.cljs
rename to frontend/src/app/main/data/tinycolor.cljs
index 10c809e397..13fea42e00 100644
--- a/frontend/src/app/main/ui/workspace/tokens/tinycolor.cljs
+++ b/frontend/src/app/main/data/tinycolor.cljs
@@ -1,4 +1,10 @@
-(ns app.main.ui.workspace.tokens.tinycolor
+;; 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.tinycolor
"Bindings for tinycolor2 which supports a wide range of css compatible colors.
This library was chosen as it is already used by StyleDictionary,
@@ -32,17 +38,24 @@
(let [tc (tinycolor color-str)]
(str/starts-with? (.getFormat tc) "hex"))))
-(defn ->string [^js tc]
- (.toString tc))
+(defn ->string
+ "Stringify `tc` to `format`, uses `hex` as per default."
+ [^js tc format]
+ (let [format' (case format
+ ;; Tinycolor `.toString` doesnt support the `a` suffix it gives you via `.getFormat`
+ "rgba" "rgb"
+ "hsva" "hsv"
+ ;; Keep these formats
+ "rgb" "rgb"
+ "hsv" "hsv"
+ ;; Fall back to hex as the default
+ "hex")]
+ (.toString tc format')))
(defn ->hex-string [^js tc]
(assert (tinycolor? tc))
(.toHexString tc))
-(defn ->rgba-string [^js tc]
- (assert (tinycolor? tc))
- (.toRgbString tc))
-
(defn color-format [^js tc]
(assert (tinycolor? tc))
(.getFormat tc))
diff --git a/frontend/src/app/main/data/workspace.cljs b/frontend/src/app/main/data/workspace.cljs
index 01dc099c8a..8817dafd93 100644
--- a/frontend/src/app/main/data/workspace.cljs
+++ b/frontend/src/app/main/data/workspace.cljs
@@ -13,6 +13,7 @@
[app.common.features :as cfeat]
[app.common.files.changes-builder :as pcb]
[app.common.files.helpers :as cfh]
+ [app.common.files.variant :as cfv]
[app.common.geom.align :as gal]
[app.common.geom.point :as gpt]
[app.common.geom.proportions :as gpp]
@@ -25,7 +26,7 @@
[app.common.schema :as sm]
[app.common.text :as txt]
[app.common.transit :as t]
- [app.common.types.component :as ctk]
+ [app.common.types.component :as ctc]
[app.common.types.components-list :as ctkl]
[app.common.types.container :as ctn]
[app.common.types.file :as ctf]
@@ -75,6 +76,7 @@
[app.main.data.workspace.thumbnails :as dwth]
[app.main.data.workspace.transforms :as dwt]
[app.main.data.workspace.undo :as dwu]
+ [app.main.data.workspace.variants :as dwva]
[app.main.data.workspace.viewport :as dwv]
[app.main.data.workspace.zoom :as dwz]
[app.main.errors]
@@ -85,6 +87,7 @@
[app.main.streams :as ms]
[app.main.worker :as uw]
[app.render-wasm :as wasm]
+ [app.render-wasm.api :as api]
[app.util.code-gen.style-css :as css]
[app.util.dom :as dom]
[app.util.globals :as ug]
@@ -393,6 +396,13 @@
(rx/filter dch/commit?)
(rx/map deref)
(rx/mapcat (fn [{:keys [save-undo? undo-changes redo-changes undo-group tags stack-undo?]}]
+ (when render-wasm?
+ (let [added (->> redo-changes
+ (filter #(= (:type %) :add-obj))
+ (map :obj))]
+ (doseq [shape added]
+ (api/process-object shape))))
+
(if (and save-undo? (seq undo-changes))
(let [entry {:undo-changes undo-changes
:redo-changes redo-changes
@@ -571,7 +581,7 @@
name (cfh/generate-unique-name base-name unames :suffix-fn suffix-fn)
objects (update-vals (:objects page) #(dissoc % :use-for-thumbnail))
- main-instances-ids (set (keep #(when (ctk/main-instance? (val %)) (key %)) objects))
+ main-instances-ids (set (keep #(when (ctc/main-instance? (val %)) (key %)) objects))
ids-to-remove (set (apply concat (map #(cfh/get-children-ids objects %) main-instances-ids)))
add-component-copy
@@ -582,7 +592,6 @@
component
fdata
(gpt/point (:x shape) (:y shape))
- true
{:keep-ids? true :force-frame-id (:frame-id shape)})
children (into {} (map (fn [shape] [(:id shape) shape]) new-shapes))
objs (assoc objs id new-shape)]
@@ -698,7 +707,7 @@
(defn rename-file
[id name]
{:pre [(uuid? id) (string? name)]}
- (let [name (str/prune name 200)]
+ (let [name (dm/truncate name 200)]
(ptk/reify ::rename-file
IDeref
(-deref [_]
@@ -788,27 +797,36 @@
([] (end-rename-shape nil nil))
([shape-id name]
(ptk/reify ::end-rename-shape
+ ptk/UpdateEvent
+ (update [_ state]
+ ;; Remove rename state from workspace local state
+ (update state :workspace-local dissoc :shape-for-rename))
ptk/WatchEvent
(watch [_ state _]
(when-let [shape-id (d/nilv shape-id (dm/get-in state [:workspace-local :shape-for-rename]))]
- (let [shape (dsh/lookup-shape state shape-id)
- name (str/trim name)
- clean-name (cfh/clean-path name)
- valid? (and (not (str/ends-with? name "/"))
- (string? clean-name)
- (not (str/blank? clean-name)))]
- (rx/concat
- ;; Remove rename state from workspace local state
- (rx/of #(update % :workspace-local dissoc :shape-for-rename))
+ (let [shape (dsh/lookup-shape state shape-id)
+ name (str/trim name)
+ clean-name (cfh/clean-path name)
+ valid? (and (not (str/ends-with? name "/"))
+ (string? clean-name)
+ (not (str/blank? clean-name)))
+ component-id (:component-id shape)
+ undo-id (js/Symbol)]
- ;; Rename the shape if string is not empty/blank
- (when valid?
- (rx/of (update-shape shape-id {:name clean-name})))
- ;; Update the component in case if shape is a main instance
- (when (and valid? (:main-instance shape))
- (when-let [component-id (:component-id shape)]
- (rx/of (dwl/rename-component component-id clean-name)))))))))))
+ (when valid?
+ (if (ctc/is-variant-container? shape)
+ ;; Rename the full variant when it is a variant container
+ (rx/of (dwva/rename-variant shape-id clean-name))
+ (rx/of
+ (dwu/start-undo-transaction undo-id)
+ ;; Rename the shape if string is not empty/blank
+ (update-shape shape-id {:name clean-name})
+
+ ;; Update the component in case shape is a main instance
+ (when (and (some? component-id) (ctc/main-instance? shape))
+ (dwl/rename-component component-id clean-name))
+ (dwu/commit-undo-transaction undo-id))))))))))
;; --- Update Selected Shapes attrs
@@ -1200,22 +1218,26 @@
(ptk/reify ::show-component-in-assets
ptk/WatchEvent
(watch [_ state _]
- (let [file-id (:current-file-id state)
- fdata (dsh/lookup-file-data state file-id)
- cpath (dm/get-in fdata [:components component-id :path])
- cpath (cfh/split-path cpath)
- paths (map (fn [i] (cfh/join-path (take (inc i) cpath)))
- (range (count cpath)))]
+ (let [file-id (:current-file-id state)
+ fdata (dsh/lookup-file-data state file-id)
+ component (cfv/get-primary-component fdata component-id)
+ cpath (:path component)
+ cpath (cfh/split-path cpath)
+ paths (map (fn [i] (cfh/join-path (take (inc i) cpath)))
+ (range (count cpath)))]
(rx/concat
(rx/from (map #(set-assets-group-open file-id :components % true) paths))
(rx/of (dcm/go-to-workspace :layout :assets)
(set-assets-section-open file-id :library true)
(set-assets-section-open file-id :components true)
- (select-single-asset file-id component-id :components)))))
+ (select-single-asset file-id (:id component) :components)))))
ptk/EffectEvent
- (effect [_ _ _]
- (let [wrapper-id (str "component-shape-id-" component-id)]
+ (effect [_ state _]
+ (let [file-id (:current-file-id state)
+ fdata (dsh/lookup-file-data state file-id)
+ component (cfv/get-primary-component fdata component-id)
+ wrapper-id (str "component-shape-id-" (:id component))]
(tm/schedule-on-idle #(dom/scroll-into-view-if-needed! (dom/get-element wrapper-id)))))))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
@@ -1352,15 +1374,31 @@
(assoc obj ::images images))))
(rx/of obj))))
+ (collect-variants [state shape]
+ (let [page-id (:current-page-id state)
+ data (dsh/lookup-file-data state)
+ objects (-> (dsh/get-page data page-id)
+ (get :objects))
+
+ components (cfv/find-variant-components data objects (:id shape))]
+ (into {} (map (juxt :id :variant-properties) components))))
+
+
;; Collects all the items together and split images into a
;; separated data structure for a more easy paste process.
- (collect-data [result {:keys [id ::images] :as item}]
+ ;; Also collects the variant properties of the copied variants
+ (collect-data [state result {:keys [id ::images] :as item}]
(cond-> result
:always
(update :objects assoc id (dissoc item ::images))
(some? images)
- (update :images into images)))
+ (update :images into images)
+
+ (ctc/is-variant-container? item)
+ (update :variant-properties merge (collect-variants state item))))
+
+
(maybe-translate [shape objects parent-frame-id]
(if (= parent-frame-id uuid/zero)
@@ -1382,7 +1420,7 @@
heads))))
(advance-copy [file libraries page objects shape]
- (if (and (ctk/instance-head? shape) (not (ctk/main-instance? shape)))
+ (if (and (ctc/instance-head? shape) (not (ctc/main-instance? shape)))
(let [level-delta (ctn/get-nesting-level-delta (:objects page) shape uuid/zero)]
(if (pos? level-delta)
(reduce (partial advance-shape file libraries page level-delta)
@@ -1445,7 +1483,7 @@
(fn [resolve reject]
(->> (rx/from shapes)
(rx/merge-map (partial prepare-object objects frame-id))
- (rx/reduce collect-data initial)
+ (rx/reduce (partial collect-data state) initial)
(rx/map (partial sort-selected state))
(rx/map (partial advance-copies state selected))
(rx/map #(t/encode-str % {:type :json-verbose}))
@@ -1460,7 +1498,7 @@
;; https://caniuse.com/?search=ClipboardItem
(->> (rx/from shapes)
(rx/merge-map (partial prepare-object objects frame-id))
- (rx/reduce collect-data initial)
+ (rx/reduce (partial collect-data state) initial)
(rx/map (partial sort-selected state))
(rx/map (partial advance-copies state selected))
(rx/map #(t/encode-str % {:type :json-verbose}))
@@ -2048,6 +2086,9 @@
objects (:objects pdata)
+ variant-props (:variant-properties pdata)
+
+
position (deref ms/mouse-position)
;; Calculate position for the pasted elements
@@ -2060,12 +2101,8 @@
libraries (dsh/lookup-libraries state)
ldata (dsh/lookup-file-data state file-id)
- ;; full-libs (assoc-in libraries [(:id ldata) :data] ldata)
-
- full-libs libraries
-
[parent-id
- frame-id] (ctn/find-valid-parent-and-frame-ids candidate-parent-id page-objects (vals objects) true full-libs)
+ frame-id] (ctn/find-valid-parent-and-frame-ids candidate-parent-id page-objects (vals objects) true libraries)
index (if (= candidate-parent-id parent-id)
index
@@ -2079,12 +2116,12 @@
all-objects (merge page-objects objects)
-
drop-cell (when (ctl/grid-layout? all-objects parent-id)
(gslg/get-drop-cell frame-id all-objects position))
changes (-> (pcb/empty-changes it)
- (cll/generate-duplicate-changes all-objects page selected delta libraries ldata file-id)
+ (cll/generate-duplicate-changes all-objects page selected delta
+ libraries ldata file-id {:variant-props variant-props})
(pcb/amend-changes (partial process-rchange media-idx))
(pcb/amend-changes (partial change-add-obj-index objects selected index)))
@@ -2113,7 +2150,7 @@
undo-id (js/Symbol)]
(rx/concat
- (->> (filter ctk/instance-head? orig-shapes)
+ (->> (filter ctc/instance-head? orig-shapes)
(map (fn [{:keys [component-file]}]
(ptk/event ::ev/event
{::ev/name "use-library-component"
@@ -2428,7 +2465,7 @@
(let [objects (dsh/lookup-page-objects state)
copies (->> objects
vals
- (filter #(and (ctk/instance-head? %) (not (ctk/main-instance? %)))))
+ (filter #(and (ctc/instance-head? %) (not (ctc/main-instance? %)))))
copies-no-ref (filter #(not (:shape-ref %)) copies)
find-childs-no-ref (fn [acc-map item]
diff --git a/frontend/src/app/main/data/workspace/libraries.cljs b/frontend/src/app/main/data/workspace/libraries.cljs
index 9c98fcd939..d433cc133b 100644
--- a/frontend/src/app/main/data/workspace/libraries.cljs
+++ b/frontend/src/app/main/data/workspace/libraries.cljs
@@ -42,7 +42,6 @@
[app.main.data.workspace.transforms :as dwtr]
[app.main.data.workspace.undo :as dwu]
[app.main.data.workspace.zoom :as dwz]
- [app.main.features :as features]
[app.main.features.pointer-map :as fpmap]
[app.main.refs :as refs]
[app.main.repo :as rp]
@@ -395,9 +394,9 @@
(defn- add-component2
"This is the second step of the component creation."
- ([selected components-v2]
- (add-component2 nil selected components-v2))
- ([id-ref selected components-v2]
+ ([selected]
+ (add-component2 nil selected))
+ ([id-ref selected]
(ptk/reify ::add-component2
ev/Event
(-data [_]
@@ -413,8 +412,7 @@
parents (into #{} (map :parent-id) shapes)]
(when-not (empty? shapes)
(let [[root component-id changes]
- (cll/generate-add-component (pcb/empty-changes it) shapes objects page-id file-id components-v2
- dwg/prepare-create-group
+ (cll/generate-add-component (pcb/empty-changes it) shapes objects page-id file-id
cfsh/prepare-create-artboard-from-selection)]
(when id-ref
(reset! id-ref component-id))
@@ -439,12 +437,11 @@
selected (->> (d/nilv ids (dsh/lookup-selected state))
(cfh/clean-loops objects))
selected-objects (map #(get objects %) selected)
- components-v2 (features/active-feature? state "components/v2")
;; We don't want to change the structure of component copies
can-make-component (every? true? (map #(ctn/valid-shape-for-component? objects %) selected-objects))]
(when can-make-component
- (rx/of (add-component2 id-ref selected components-v2))))))))
+ (rx/of (add-component2 id-ref selected))))))))
(defn add-multiple-components
"Add several new components to current file library, from the currently selected shapes."
@@ -452,15 +449,14 @@
(ptk/reify ::add-multiple-components
ptk/WatchEvent
(watch [_ state _]
- (let [components-v2 (features/active-feature? state "components/v2")
- objects (dsh/lookup-page-objects state)
+ (let [objects (dsh/lookup-page-objects state)
selected (->> (dsh/lookup-selected state)
(cfh/clean-loops objects))
selected-objects (map #(get objects %) selected)
;; We don't want to change the structure of component copies
can-make-component (every? true? (map #(ctn/valid-shape-for-component? objects %) selected-objects))
added-components (map (fn [id]
- (with-meta (add-component2 [id] components-v2)
+ (with-meta (add-component2 [id])
{:multiple true}))
selected)
undo-id (js/Symbol)]
@@ -489,7 +485,7 @@
(rx/empty)
(let [data (dsh/lookup-file-data state)
changes (-> (pcb/empty-changes it)
- (cll/generate-rename-component id new-name data true))]
+ (cll/generate-rename-component id new-name data))]
(rx/of (dch/commit-changes changes))))))))
(defn rename-component-and-main-instance
@@ -512,7 +508,6 @@
(rx/concat
(rx/of (rename-component component-id clean-name))
- ;; NOTE: only when components-v2 is enabled
(when (and shape-id page-id)
(rx/of (dwsh/update-shapes [shape-id] #(assoc % :name clean-name) {:page-id page-id :stack-undo? true}))))))))))
@@ -526,11 +521,10 @@
(watch [it state _]
(let [libraries (dsh/lookup-libraries state)
library (get libraries library-id)
- components-v2 (features/active-feature? state "components/v2")
[main-instance changes]
(-> (pcb/empty-changes it nil)
- (cll/generate-duplicate-component library component-id new-component-id components-v2))]
+ (cll/generate-duplicate-component library component-id new-component-id))]
(rx/of
(ptk/data-event :layout/update {:ids [(:id main-instance)]})
(dch/commit-changes changes)))))))
@@ -560,8 +554,7 @@
[all-parents changes]
(-> (pcb/empty-changes it page-id)
;; Deleting main root triggers component delete
- (cls/generate-delete-shapes fdata page objects #{root-id} {:components-v2 true
- :undo-group undo-group
+ (cls/generate-delete-shapes fdata page objects #{root-id} {:undo-group undo-group
:undo-id undo-id}))]
(rx/of
(dwu/start-undo-transaction undo-id)
@@ -588,11 +581,14 @@
changes (-> (pcb/empty-changes it)
(cll/generate-restore-component ldata component-id library-id page objects))
+ page-id
+ (->> changes :redo-changes (keep :page-id) first)
+
frames
(->> changes :redo-changes (keep :frame-id))]
(rx/of (dch/commit-changes changes)
- (ptk/data-event :layout/update {:ids frames}))))))
+ (ptk/data-event :layout/update {:page-id page-id :ids frames}))))))
(defn restore-components
@@ -832,7 +828,7 @@
changes
(-> (pcb/empty-changes it)
- (cll/generate-reset-component file libraries container id true))]
+ (cll/generate-reset-component file libraries container id))]
(log/debug :msg "RESET-COMPONENT finished" :js/rchanges (log-changes
(:redo-changes changes)
@@ -884,7 +880,7 @@
(-> (pcb/empty-changes it)
(pcb/set-undo-group undo-group)
(pcb/with-container container)
- (cll/generate-sync-shape-inverse fdata libraries container id true))
+ (cll/generate-sync-shape-inverse fdata libraries container id))
ldata (->> (:component-file shape)
(dsh/lookup-file-data state))
@@ -1274,10 +1270,8 @@
[]
(ptk/reify ::watch-component-changes
ptk/WatchEvent
- (watch [_ state stream]
- (let [components-v2? (features/active-feature? state "components/v2")
-
- stopper-s
+ (watch [_ _ stream]
+ (let [stopper-s
(->> stream
(rx/filter #(or (= ::dw/finalize-page (ptk/type %))
(= ::watch-component-changes (ptk/type %)))))
@@ -1340,7 +1334,7 @@
(rx/debounce 5000)
(rx/tap #(log/trc :hint "buffer initialized")))]
- (when (and components-v2? (contains? cf/flags :component-thumbnails))
+ (when (contains? cf/flags :component-thumbnails)
(->> (rx/merge
changes-s
diff --git a/frontend/src/app/main/data/workspace/media.cljs b/frontend/src/app/main/data/workspace/media.cljs
index 3a6be86c25..a2a7968c09 100644
--- a/frontend/src/app/main/data/workspace/media.cljs
+++ b/frontend/src/app/main/data/workspace/media.cljs
@@ -24,7 +24,6 @@
[app.main.data.helpers :as dsh]
[app.main.data.media :as dmm]
[app.main.data.notifications :as ntf]
- [app.main.data.workspace.libraries :as dwl]
[app.main.data.workspace.shapes :as dwsh]
[app.main.data.workspace.svg-upload :as svg]
[app.main.repo :as rp]
@@ -235,16 +234,6 @@
(rx/catch #(handle-media-error % on-error))
(rx/finalize #(st/emit! (ntf/hide :tag :media-loading))))))))
-;; Deprecated in components-v2
-(defn upload-media-asset
- [params]
- (let [params (assoc params
- :force-media true
- :local? false
- :on-image #(st/emit! (dwl/add-media %))
- :on-svg #(st/emit! (dwl/add-media %)))]
- (process-media-objects params)))
-
(defn upload-media-workspace
[{:keys [position file-id] :as params}]
(let [params (assoc params
@@ -378,7 +367,7 @@
(defn- add-shapes-and-component
[it file-data page name [shape children]]
- (let [[component-shape component-shapes updated-shapes]
+ (let [[component-shape updated-shapes]
(ctn/convert-shape-in-component shape children (:id file-data))
changes (-> (pcb/empty-changes it)
@@ -389,7 +378,6 @@
(pcb/add-component (:id component-shape)
""
name
- component-shapes
updated-shapes
(:id shape)
(:id page)))]
diff --git a/frontend/src/app/main/data/workspace/modifiers.cljs b/frontend/src/app/main/data/workspace/modifiers.cljs
index ace4d0fc4c..d8cc7cf220 100644
--- a/frontend/src/app/main/data/workspace/modifiers.cljs
+++ b/frontend/src/app/main/data/workspace/modifiers.cljs
@@ -30,6 +30,7 @@
[app.main.data.workspace.undo :as dwu]
[app.main.features :as features]
[app.render-wasm.api :as wasm.api]
+ [app.render-wasm.shape :as wasm.shape]
[beicon.v2.core :as rx]
[potok.v2.core :as ptk]))
@@ -162,17 +163,46 @@
change-to-fixed?
(assoc :grow-type :fixed))))
+(defn- set-wasm-props!
+ [objects prev-wasm-props wasm-props]
+ (let [;; Set old value for previous properties
+ clean-props
+ (->> prev-wasm-props
+ (map (fn [[id {:keys [property] :as change}]]
+ (let [shape (get objects id)]
+ [id (assoc change :value (get shape property))]))))
+
+ wasm-props
+ (concat clean-props wasm-props)
+
+ wasm-props
+ (-> (group-by first wasm-props)
+ (update-vals #(map second %)))]
+
+ ;; Props are grouped by id and then assoc to the shape the new value
+ (doseq [[id properties] wasm-props]
+ (let [shape
+ (->> properties
+ (reduce
+ (fn [shape {:keys [property value]}]
+ (assoc shape property value))
+ (get objects id)))]
+
+ ;; With the new values to the shape change multi props
+ (wasm.shape/set-wasm-multi-attrs! shape (->> properties (map :property)))))))
+
(defn clear-local-transform []
(ptk/reify ::clear-local-transform
ptk/EffectEvent
(effect [_ state _]
(when (features/active-feature? state "render-wasm/v1")
- (wasm.api/set-modifiers nil)))
+ (wasm.api/clean-modifiers)
+ (set-wasm-props! (dsh/lookup-page-objects state) (:wasm-props state) [])))
ptk/UpdateEvent
(update [_ state]
(-> state
- (dissoc :workspace-modifiers)
+ (dissoc :workspace-modifiers :wasm-props :prev-wasm-props)
(dissoc :app.main.data.workspace.transforms/current-move-selected)))))
(defn create-modif-tree
@@ -417,6 +447,57 @@
modifiers (calculate-modifiers state ignore-constraints ignore-snap-pixel modif-tree page-id params)]
(assoc state :workspace-modifiers modifiers))))))
+(defn- parse-structure-modifiers
+ [modif-tree]
+ (into
+ []
+ (mapcat
+ (fn [[parent-id data]]
+ (when (ctm/has-structure? (:modifiers data))
+ (->> data
+ :modifiers
+ :structure-parent
+ (mapcat
+ (fn [modifier]
+ (case (:type modifier)
+ :remove-children
+ (->> (:value modifier)
+ (map (fn [child-id]
+ {:type :remove-children
+ :parent parent-id
+ :id child-id
+ :index 0})))
+
+ :add-children
+ (->> (:value modifier)
+ (map (fn [child-id]
+ {:type :add-children
+ :parent parent-id
+ :id child-id
+ :index (:index modifier)})))
+ nil)))))))
+ modif-tree))
+
+(defn- parse-geometry-modifiers
+ [modif-tree]
+ (into
+ []
+ (keep
+ (fn [[id data]]
+ (when (ctm/has-geometry? (:modifiers data))
+ {:id id
+ :transform (ctm/modifiers->transform (:modifiers data))})))
+ modif-tree))
+
+(defn- extract-property-changes
+ [modif-tree]
+ (->> modif-tree
+ (mapcat (fn [[id {:keys [modifiers]}]]
+ (->> (:structure-parent modifiers)
+ (map #(vector id %)))))
+ (filter (fn [[_ {:keys [type]}]]
+ (= type :change-property)))))
+
(defn set-wasm-modifiers
([modif-tree]
(set-wasm-modifiers modif-tree false))
@@ -429,17 +510,31 @@
([modif-tree _ignore-constraints _ignore-snap-pixel _params]
(ptk/reify ::set-wasm-modifiers
- ptk/EffectEvent
- (effect [_ _ _]
- (let [entries
- (->> modif-tree
- (mapv (fn [[id data]]
- {:id id
- :transform (ctm/modifiers->transform (:modifiers data))})))
+ ptk/UpdateEvent
+ (update [_ state]
+ (let [property-changes
+ (extract-property-changes modif-tree)]
- modifiers-new
- (wasm.api/propagate-modifiers entries)]
- (wasm.api/set-modifiers modifiers-new))))))
+ (-> state
+ (assoc :prev-wasm-props (:wasm-props state))
+ (assoc :wasm-props property-changes))))
+
+ ptk/EffectEvent
+ (effect [_ state _]
+ (wasm.api/clean-modifiers)
+
+ (let [prev-wasm-props (:prev-wasm-props state)
+ wasm-props (:wasm-props state)
+ objects (dsh/lookup-page-objects state)]
+
+ (set-wasm-props! objects prev-wasm-props wasm-props)
+
+ (let [structure-entries (parse-structure-modifiers modif-tree)]
+ (wasm.api/set-structure-modifiers structure-entries)
+ (let [geometry-entries (parse-geometry-modifiers modif-tree)
+ modifiers-new
+ (wasm.api/propagate-modifiers geometry-entries)]
+ (wasm.api/set-modifiers modifiers-new))))))))
(defn set-selrect-transform
[modifiers]
@@ -654,4 +749,3 @@
(if undo-transation?
(rx/of (dwu/commit-undo-transaction undo-id))
(rx/empty))))))))
-
diff --git a/frontend/src/app/main/data/workspace/shape_layout.cljs b/frontend/src/app/main/data/workspace/shape_layout.cljs
index ffabffbe8a..61b07c159a 100644
--- a/frontend/src/app/main/data/workspace/shape_layout.cljs
+++ b/frontend/src/app/main/data/workspace/shape_layout.cljs
@@ -97,15 +97,17 @@
;; Never call this directly but through the data-event `:layout/update`
;; Otherwise a lot of cycle dependencies could be generated
(defn- update-layout-positions
- [{:keys [ids undo-group]}]
+ [{:keys [page-id ids undo-group]}]
(ptk/reify ::update-layout-positions
ptk/WatchEvent
(watch [_ state _]
- (let [objects (dsh/lookup-page-objects state)
+ (let [page-id (or page-id (:current-page-id state))
+ objects (dsh/lookup-page-objects state page-id)
ids (->> ids (filter #(contains? objects %)))]
(if (d/not-empty? ids)
(let [modif-tree (dwm/create-modif-tree ids (ctm/reflow-modifiers))]
- (rx/of (dwm/apply-modifiers {:modifiers modif-tree
+ (rx/of (dwm/apply-modifiers {:page-id page-id
+ :modifiers modif-tree
:stack-undo? true
:undo-group undo-group})))
(rx/empty))))))
@@ -127,8 +129,9 @@
(rx/filter #(d/not-empty? %))
(rx/map
(fn [data]
- (let [ids (reduce #(into %1 (:ids %2)) #{} data)]
- (update-layout-positions {:ids ids}))))
+ (let [page-id (->> data (keep :page-id) first)
+ ids (reduce #(into %1 (:ids %2)) #{} data)]
+ (update-layout-positions {:page-id page-id :ids ids}))))
(rx/take-until stopper))))))
(defn finalize-shape-layout
@@ -242,12 +245,13 @@
selected-shapes (map (d/getf objects) selected)
single? (= (count selected-shapes) 1)
is-frame? (= :frame (:type (first selected-shapes)))
- is-variant-cont? (ctc/is-variant-container? (first selected-shapes))
+ has-layout? (ctl/any-layout? (first selected-shapes))
+
undo-id (js/Symbol)]
(rx/of
(dwu/start-undo-transaction undo-id)
- (if (and single? is-frame? (not is-variant-cont?))
+ (if (and single? is-frame? (not has-layout?))
(create-layout-from-id (first selected) type :from-frame? true)
(create-layout-from-selection type))
(dwu/commit-undo-transaction undo-id))))))
diff --git a/frontend/src/app/main/data/workspace/shapes.cljs b/frontend/src/app/main/data/workspace/shapes.cljs
index b65989e269..d9862564b3 100644
--- a/frontend/src/app/main/data/workspace/shapes.cljs
+++ b/frontend/src/app/main/data/workspace/shapes.cljs
@@ -24,7 +24,6 @@
[app.main.data.workspace.edition :as dwe]
[app.main.data.workspace.selection :as dws]
[app.main.data.workspace.undo :as dwu]
- [app.main.features :as features]
[beicon.v2.core :as rx]
[potok.v2.core :as ptk]))
@@ -171,12 +170,10 @@
page (dsh/get-page fdata page-id)
objects (:objects page)
- components-v2 (features/active-feature? state "components/v2")
undo-id (or (:undo-id options) (js/Symbol))
[all-parents changes] (-> (pcb/empty-changes it (:id page))
(cls/generate-delete-shapes fdata page objects ids
- {:components-v2 components-v2
- :ignore-touched (:component-swap options)
+ {:ignore-touched (:component-swap options)
:undo-group (:undo-group options)
:undo-id undo-id}))]
@@ -237,6 +234,8 @@
([id parent-id index]
(create-artboard-from-selection id parent-id index nil))
([id parent-id index name]
+ (create-artboard-from-selection id parent-id index name nil))
+ ([id parent-id index name delta]
(ptk/reify ::create-artboard-from-selection
ptk/WatchEvent
(watch [it state _]
@@ -260,7 +259,9 @@
selected
index
name
- false)
+ false
+ nil
+ delta)
undo-id (js/Symbol)]
diff --git a/frontend/src/app/main/data/workspace/shortcuts.cljs b/frontend/src/app/main/data/workspace/shortcuts.cljs
index a54e14cf0b..e1535516bf 100644
--- a/frontend/src/app/main/data/workspace/shortcuts.cljs
+++ b/frontend/src/app/main/data/workspace/shortcuts.cljs
@@ -464,11 +464,11 @@
:subsections [:panels]
:fn #(st/emit! (dcm/go-to-workspace :layout :assets))}
- :toggle-history {:tooltip (ds/alt "H")
- :command (ds/a-mod "h")
+ :toggle-history {:tooltip (ds/meta-alt "H")
+ :command (ds/ca-mod "h")
:subsections [:panels]
:fn #(emit-when-no-readonly
- (dcm/go-to-workspace :layout :document-history))}
+ (dw/toggle-layout-flag :document-history))}
:toggle-colorpalette {:tooltip (ds/alt "P")
:command (ds/a-mod "p")
diff --git a/frontend/src/app/main/data/workspace/thumbnails.cljs b/frontend/src/app/main/data/workspace/thumbnails.cljs
index 467a999192..11d1503bdc 100644
--- a/frontend/src/app/main/data/workspace/thumbnails.cljs
+++ b/frontend/src/app/main/data/workspace/thumbnails.cljs
@@ -10,6 +10,7 @@
[app.common.files.helpers :as cfh]
[app.common.logging :as l]
[app.common.thumbnails :as thc]
+ [app.common.types.component :as ctc]
[app.common.uuid :as uuid]
[app.main.data.changes :as dch]
[app.main.data.helpers :as dsh]
@@ -184,11 +185,11 @@
(rx/filter (ptk/type? ::clear-thumbnail))
(rx/filter #(= (deref %) object-id))))))))))
-(defn- extract-root-frame-changes
+(defn- extract-frame-changes
"Process a changes set in a commit to extract the frames that are changing"
[page-id [event [old-data new-data]]]
- (let [changes (:changes event)
+ (let [changes (:changes event)
lookup-data-objects
(fn [data page-id]
(dm/get-in data [:pages-index page-id :objects]))
@@ -205,21 +206,28 @@
get-frame-ids
(fn get-frame-ids [id]
- (let [old-objects (lookup-data-objects old-data page-id)
- new-objects (lookup-data-objects new-data page-id)
+ (let [old-objects (lookup-data-objects old-data page-id)
+ new-objects (lookup-data-objects new-data page-id)
- new-shape (get new-objects id)
- old-shape (get old-objects id)
+ new-shape (get new-objects id)
+ old-shape (get old-objects id)
- old-frame-id (if (cfh/frame-shape? old-shape) id (:frame-id old-shape))
- new-frame-id (if (cfh/frame-shape? new-shape) id (:frame-id new-shape))]
+ old-frame-id (if (cfh/frame-shape? old-shape) id (:frame-id old-shape))
+ new-frame-id (if (cfh/frame-shape? new-shape) id (:frame-id new-shape))
+
+ root-frame-old? (cfh/root-frame? old-objects old-frame-id)
+ root-frame-new? (cfh/root-frame? new-objects new-frame-id)
+ instance-root? (ctc/instance-root? new-shape)]
(cond-> #{}
- (cfh/root-frame? old-objects old-frame-id)
- (conj old-frame-id)
+ root-frame-old?
+ (conj ["frame" old-frame-id])
- (cfh/root-frame? new-objects new-frame-id)
- (conj new-frame-id)
+ root-frame-new?
+ (conj ["frame" new-frame-id])
+
+ instance-root?
+ (conj ["component" id])
(and (uuid? (:frame-id old-shape))
(not= uuid/zero (:frame-id old-shape)))
@@ -266,7 +274,7 @@
(rx/map deref)
(rx/observe-on :async)
(rx/with-latest-from workspace-data-s)
- (rx/merge-map (partial extract-root-frame-changes page-id))
+ (rx/merge-map (partial extract-frame-changes page-id))
(rx/tap #(l/trc :hint "inconming change" :origin "all" :frame-id (dm/str %)))
(rx/share))
@@ -281,15 +289,15 @@
;; and interrupt any ongoing update-thumbnail process
;; related to current frame-id
(->> all-commits-s
- (rx/mapcat (fn [frame-id]
- (rx/of (clear-thumbnail file-id page-id frame-id "frame")
- (clear-thumbnail file-id page-id frame-id "component")))))
+ (rx/mapcat (fn [[tag frame-id]]
+ (rx/of (clear-thumbnail file-id page-id frame-id tag)))))
;; Generate thumbnails in batches, once user becomes
;; inactive for some instant.
(->> all-commits-s
(rx/buffer-until notifier-s)
(rx/mapcat #(into #{} %))
- (rx/map #(update-thumbnail file-id page-id % "frame" "watch-state-changes"))))
+ (rx/map (fn [[tag frame-id]]
+ (update-thumbnail file-id page-id frame-id tag "watch-state-changes")))))
(rx/take-until stopper-s))))))
diff --git a/frontend/src/app/main/ui/workspace/tokens/changes.cljs b/frontend/src/app/main/data/workspace/tokens/application.cljs
similarity index 94%
rename from frontend/src/app/main/ui/workspace/tokens/changes.cljs
rename to frontend/src/app/main/data/workspace/tokens/application.cljs
index 8bdc1a67f8..16f5ff28e6 100644
--- a/frontend/src/app/main/ui/workspace/tokens/changes.cljs
+++ b/frontend/src/app/main/data/workspace/tokens/application.cljs
@@ -4,16 +4,19 @@
;;
;; Copyright (c) KALEIDOS INC
-(ns app.main.ui.workspace.tokens.changes
+(ns app.main.data.workspace.tokens.application
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
+ [app.common.files.tokens :as cft]
[app.common.types.shape.layout :as ctsl]
[app.common.types.shape.radius :as ctsr]
[app.common.types.token :as ctt]
[app.common.types.tokens-lib :as ctob]
[app.main.data.event :as ev]
[app.main.data.helpers :as dsh]
+ [app.main.data.style-dictionary :as sd]
+ [app.main.data.tinycolor :as tinycolor]
[app.main.data.workspace :as udw]
[app.main.data.workspace.colors :as wdc]
[app.main.data.workspace.shape-layout :as dwsl]
@@ -21,16 +24,13 @@
[app.main.data.workspace.transforms :as dwt]
[app.main.data.workspace.undo :as dwu]
[app.main.store :as st]
- [app.main.ui.workspace.tokens.style-dictionary :as sd]
- [app.main.ui.workspace.tokens.tinycolor :as tinycolor]
- [app.main.ui.workspace.tokens.token :as wtt]
[beicon.v2.core :as rx]
[clojure.set :as set]
[potok.v2.core :as ptk]))
(declare token-properties)
-;; Token Updates ---------------------------------------------------------------
+;; Events to apply / unapply tokens to shapes ------------------------------------------------------------
(defn apply-token
"Apply `attributes` that match `token` for `shape-ids`.
@@ -56,8 +56,8 @@
(keys))
[])
- resolved-value (get-in resolved-tokens [(wtt/token-identifier token) :resolved-value])
- tokenized-attributes (wtt/attributes-map attributes token)]
+ resolved-value (get-in resolved-tokens [(cft/token-identifier token) :resolved-value])
+ tokenized-attributes (cft/attributes-map attributes token)]
(rx/of
(st/emit! (ptk/event ::ev/event {::ev/name "apply-tokens"}))
(dwu/start-undo-transaction undo-id)
@@ -80,7 +80,7 @@
ptk/WatchEvent
(watch [_ _ _]
(rx/of
- (let [remove-token #(when % (wtt/remove-attributes-for-token attributes token %))]
+ (let [remove-token #(when % (cft/remove-attributes-for-token attributes token %))]
(dwsh/update-shapes
shape-ids
(fn [shape]
@@ -95,7 +95,7 @@
(get token-properties (:type token))
unapply-tokens?
- (wtt/shapes-token-applied? token shapes (or all-attributes attributes))
+ (cft/shapes-token-applied? token shapes (or all-attributes attributes))
shape-ids (map :id shapes)]
(if unapply-tokens?
@@ -109,7 +109,9 @@
:shape-ids shape-ids
:on-update-shape on-update-shape})))))))
-;; Shape Updates ---------------------------------------------------------------
+;; Events to update the value of attributes with applied tokens ---------------------------------------------------------
+
+;; (note that dwsh/update-shapes function returns an event)
(defn update-shape-radius-all
([value shape-ids attributes] (update-shape-radius-all value shape-ids attributes nil))
@@ -326,7 +328,7 @@
(dwsl/update-layout-child shape-ids props {:ignore-touched true
:page-id page-id}))))))))
-;; Token Types -----------------------------------------------------------------
+;; Map token types to different properties used along the cokde ---------------------------------------------------------
;; FIXME: the values should be lazy evaluated, probably a function,
;; becasue on future we will need to translate that labels and that
diff --git a/frontend/src/app/main/data/workspace/tokens/color.cljs b/frontend/src/app/main/data/workspace/tokens/color.cljs
new file mode 100644
index 0000000000..828a1ca4cd
--- /dev/null
+++ b/frontend/src/app/main/data/workspace/tokens/color.cljs
@@ -0,0 +1,21 @@
+;; 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.tokens.color
+ (:require
+ [app.common.files.tokens :as cft]
+ [app.main.data.tinycolor :as tinycolor]))
+
+(defn color-bullet-color [token-color-value]
+ (when-let [tc (tinycolor/valid-color token-color-value)]
+ (if (tinycolor/alpha tc)
+ {:color (tinycolor/->hex-string tc)
+ :opacity (tinycolor/alpha tc)}
+ (tinycolor/->hex-string tc))))
+
+(defn resolved-token-bullet-color [{:keys [resolved-value] :as token}]
+ (when (and resolved-value (cft/color-token? token))
+ (color-bullet-color resolved-value)))
\ No newline at end of file
diff --git a/frontend/src/app/main/ui/workspace/tokens/errors.cljs b/frontend/src/app/main/data/workspace/tokens/errors.cljs
similarity index 78%
rename from frontend/src/app/main/ui/workspace/tokens/errors.cljs
rename to frontend/src/app/main/data/workspace/tokens/errors.cljs
index 1d9213c4dc..025b7e7916 100644
--- a/frontend/src/app/main/ui/workspace/tokens/errors.cljs
+++ b/frontend/src/app/main/data/workspace/tokens/errors.cljs
@@ -1,4 +1,10 @@
-(ns app.main.ui.workspace.tokens.errors
+;; 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.tokens.errors
(:require
[app.util.i18n :refer [tr]]
[cuerdas.core :as str]))
@@ -12,9 +18,15 @@
{:error/code :error.import/invalid-json-data
:error/fn #(tr "workspace.token.invalid-json")}
+ :error.import/invalid-token-name
+ {:error/code :error.import/invalid-json-data
+ :error/fn #(tr "workspace.token.invalid-json-token-name")
+ :error/detail #(tr "workspace.token.invalid-json-token-name-detail" %)}
+
:error.import/style-dictionary-reference-errors
{:error/code :error.import/style-dictionary-reference-errors
- :error/fn #(str (tr "workspace.token.import-error") "\n\n" (str/join "\n\n" %))}
+ :error/fn #(str (tr "workspace.token.import-error") "\n\n" (first %))
+ :error/detail #(str/join "\n\n" (rest %))}
:error.import/style-dictionary-unknown-error
{:error/code :error.import/style-dictionary-reference-errors
@@ -74,3 +86,11 @@
(:error/fn err) ((:error/fn err) (:error/value err))
(:error/message err) (:error/message err)
:else err)))))
+
+(defn detail-errors [errors]
+ (->> errors
+ (map (fn [err]
+ (when (:error/detail err)
+ ((:error/detail err) (:error/value err)))))
+ (filter some?)
+ (seq)))
diff --git a/frontend/src/app/main/data/tokens.cljs b/frontend/src/app/main/data/workspace/tokens/library_edit.cljs
similarity index 92%
rename from frontend/src/app/main/data/tokens.cljs
rename to frontend/src/app/main/data/workspace/tokens/library_edit.cljs
index 7c234838f3..cc3a345cf3 100644
--- a/frontend/src/app/main/data/tokens.cljs
+++ b/frontend/src/app/main/data/workspace/tokens/library_edit.cljs
@@ -4,7 +4,7 @@
;;
;; Copyright (c) KALEIDOS INC
-(ns app.main.data.tokens
+(ns app.main.data.workspace.tokens.library-edit
(:require
[app.common.data.macros :as dm]
[app.common.files.changes-builder :as pcb]
@@ -18,10 +18,9 @@
[app.main.data.helpers :as dsh]
[app.main.data.notifications :as ntf]
[app.main.data.workspace.shapes :as dwsh]
- [app.main.ui.workspace.tokens.update :as wtu]
+ [app.main.data.workspace.tokens.propagation :as dwtp]
[app.util.i18n :refer [tr]]
[beicon.v2.core :as rx]
- [cuerdas.core :as str]
[potok.v2.core :as ptk]))
(declare set-selected-token-set-name)
@@ -124,7 +123,7 @@
(pcb/update-active-token-themes active-token-themes' prev-active-token-themes))]
(rx/of
(dch/commit-changes changes)
- (wtu/update-workspace-tokens))))))
+ (dwtp/propagate-workspace-tokens))))))
(defn delete-token-theme [group theme-name]
(ptk/reify ::delete-token-theme
@@ -136,7 +135,7 @@
(pcb/set-token-theme group theme-name nil))]
(rx/of
(dch/commit-changes changes)
- (wtu/update-workspace-tokens))))))
+ (dwtp/propagate-workspace-tokens))))))
(defn create-token-set
[set-name]
@@ -192,6 +191,23 @@
(rx/of (set-selected-token-set-name name)
(dch/commit-changes changes))))))))
+(defn duplicate-token-set
+ [id is-group]
+ (ptk/reify ::duplicate-token-set
+ ptk/WatchEvent
+ (watch [it state _]
+ (let [data (dsh/lookup-file-data state)
+ name (ctob/normalize-set-name id)
+ tokens-lib (get data :tokens-lib)
+ suffix (tr "workspace.token.duplicate-suffix")]
+
+ (when-let [set (ctob/duplicate-set name tokens-lib {:suffix suffix})]
+ (let [changes (-> (pcb/empty-changes it)
+ (pcb/with-library-data data)
+ (pcb/set-token-set (:name set) is-group set))]
+ (rx/of (set-selected-token-set-name name)
+ (dch/commit-changes changes))))))))
+
(defn toggle-token-set
[name]
(assert (string? name) "expected a string for `name`")
@@ -205,7 +221,7 @@
(clt/generate-toggle-token-set tlib name))]
(rx/of (dch/commit-changes changes)
- (wtu/update-workspace-tokens))))))
+ (dwtp/propagate-workspace-tokens))))))
(defn toggle-token-set-group [group-path]
(ptk/reify ::toggle-token-set-group
@@ -217,7 +233,7 @@
(clt/generate-toggle-token-set-group (get-tokens-lib state) group-path))]
(rx/of
(dch/commit-changes changes)
- (wtu/update-workspace-tokens))))))
+ (dwtp/propagate-workspace-tokens))))))
(defn import-tokens-lib [lib]
(ptk/reify ::import-tokens-lib
@@ -228,7 +244,7 @@
(pcb/with-library-data data)
(pcb/set-tokens-lib lib))]
(rx/of (dch/commit-changes changes)
- (wtu/update-workspace-tokens))))))
+ (dwtp/propagate-workspace-tokens))))))
(defn delete-token-set-path
[group? path]
@@ -240,7 +256,7 @@
(pcb/with-library-data data)
(pcb/set-token-set (ctob/join-set-path path) group? nil))]
(rx/of (dch/commit-changes changes)
- (wtu/update-workspace-tokens))))))
+ (dwtp/propagate-workspace-tokens))))))
(defn drop-error [{:keys [error to-path]}]
(ptk/reify ::drop-error
@@ -267,7 +283,7 @@
(when-let [changes (clt/generate-move-token-set-group (pcb/empty-changes it) (get-tokens-lib state) drop-opts)]
(rx/of
(dch/commit-changes changes)
- (wtu/update-workspace-tokens)))
+ (dwtp/propagate-workspace-tokens)))
(catch :default e
(rx/of
(drop-error (ex-data e))))))))
@@ -284,7 +300,7 @@
changes (-> (pcb/empty-changes it)
(clt/generate-move-token-set tokens-lib params))]
(rx/of (dch/commit-changes changes)
- (wtu/update-workspace-tokens)))
+ (dwtp/propagate-workspace-tokens)))
(catch :default cause
(rx/of (drop-error (ex-data cause))))))))
@@ -385,17 +401,8 @@
(when-let [token (ctob/get-token token-set token-name)]
(let [tokens (ctob/get-tokens token-set)
unames (map :name tokens)
-
- suffix-fn
- (fn [copy-count]
- (let [suffix (tr "workspace.token.duplicate-suffix")]
- (str/concat "-"
- suffix
- (when (> copy-count 1)
- (str "-" copy-count)))))
-
- copy-name
- (cfh/generate-unique-name token-name unames :suffix-fn suffix-fn)]
+ suffix (tr "workspace.token.duplicate-suffix")
+ copy-name (cfh/generate-unique-name token-name unames :suffix suffix)]
(rx/of (create-token (assoc token :name copy-name)))))))))
diff --git a/frontend/src/app/main/ui/workspace/tokens/update.cljs b/frontend/src/app/main/data/workspace/tokens/propagation.cljs
similarity index 74%
rename from frontend/src/app/main/ui/workspace/tokens/update.cljs
rename to frontend/src/app/main/data/workspace/tokens/propagation.cljs
index 9de0bd2335..7bef78254b 100644
--- a/frontend/src/app/main/ui/workspace/tokens/update.cljs
+++ b/frontend/src/app/main/data/workspace/tokens/propagation.cljs
@@ -4,18 +4,18 @@
;;
;; Copyright (c) KALEIDOS INC
-(ns app.main.ui.workspace.tokens.update
+(ns app.main.data.workspace.tokens.propagation
(:require
[app.common.files.helpers :as cfh]
[app.common.logging :as l]
[app.common.types.token :as ctt]
+ [app.common.types.tokens-lib :as ctob]
[app.main.data.helpers :as dsh]
+ [app.main.data.style-dictionary :as sd]
[app.main.data.workspace.shapes :as dwsh]
[app.main.data.workspace.thumbnails :as dwt]
+ [app.main.data.workspace.tokens.application :as dwta]
[app.main.data.workspace.undo :as dwu]
- [app.main.ui.workspace.tokens.changes :as wtch]
- [app.main.ui.workspace.tokens.style-dictionary :as wtsd]
- [app.main.ui.workspace.tokens.token-set :as wtts]
[app.util.time :as dt]
[beicon.v2.core :as rx]
[clojure.data :as data]
@@ -24,21 +24,21 @@
;; Constants -------------------------------------------------------------------
-(def filter-existing-values? false)
+(def ^:private filter-existing-values? false)
-(def attributes->shape-update
- {ctt/border-radius-keys wtch/update-shape-radius-for-corners
- ctt/color-keys wtch/update-fill-stroke
- ctt/stroke-width-keys wtch/update-stroke-width
- ctt/sizing-keys wtch/update-shape-dimensions
- ctt/opacity-keys wtch/update-opacity
- #{:x :y} wtch/update-shape-position
- #{:p1 :p2 :p3 :p4} wtch/update-layout-padding
- #{:m1 :m2 :m3 :m4} wtch/update-layout-item-margin
- #{:column-gap :row-gap} wtch/update-layout-spacing
- #{:width :height} wtch/update-shape-dimensions
- #{:layout-item-min-w :layout-item-min-h :layout-item-max-w :layout-item-max-h} wtch/update-layout-sizing-limits
- ctt/rotation-keys wtch/update-rotation})
+(def ^:private attributes->shape-update
+ {ctt/border-radius-keys dwta/update-shape-radius-for-corners
+ ctt/color-keys dwta/update-fill-stroke
+ ctt/stroke-width-keys dwta/update-stroke-width
+ ctt/sizing-keys dwta/update-shape-dimensions
+ ctt/opacity-keys dwta/update-opacity
+ #{:x :y} dwta/update-shape-position
+ #{:p1 :p2 :p3 :p4} dwta/update-layout-padding
+ #{:m1 :m2 :m3 :m4} dwta/update-layout-item-margin
+ #{:column-gap :row-gap} dwta/update-layout-spacing
+ #{:width :height} dwta/update-shape-dimensions
+ #{:layout-item-min-w :layout-item-min-h :layout-item-max-w :layout-item-max-h} dwta/update-layout-sizing-limits
+ ctt/rotation-keys dwta/update-rotation})
(def attribute-actions-map
(reduce
@@ -48,6 +48,7 @@
;; Helpers ---------------------------------------------------------------------
+;; TODO: see if this can be replaced by more standard functions
(defn deep-merge
"Like d/deep-merge but unions set values."
([a b]
@@ -60,7 +61,7 @@
;; Data flows ------------------------------------------------------------------
-(defn invert-collect-key-vals
+(defn- invert-collect-key-vals
[xs resolved-tokens shape]
(-> (reduce
(fn [acc [k v]]
@@ -74,7 +75,7 @@
(update acc resolved-value (fnil conj #{}) k))))
{} xs)))
-(defn split-attribute-groups [attrs-values-map]
+(defn- split-attribute-groups [attrs-values-map]
(reduce
(fn [acc [attrs v]]
(cond
@@ -91,7 +92,7 @@
attrs (assoc acc attrs v)))
{} attrs-values-map))
-(defn shape-ids-by-values
+(defn- shape-ids-by-values
[attrs-values-map object-id]
(->> (map (fn [[value attrs]] [attrs {value #{object-id}}]) attrs-values-map)
(into {})))
@@ -121,7 +122,6 @@
[tokens frame-ids text-ids])))
-;; FIXME: revisit this
(defn- actionize-shapes-update-info [page-id shapes-update-info]
(mapcat (fn [[attrs update-infos]]
(let [action (some attribute-actions-map attrs)]
@@ -131,14 +131,15 @@
update-infos)))
shapes-update-info))
-(defn update-tokens
+(defn propagate-tokens
+ "Propagate tokens values to all shapes where they are applied"
[state resolved-tokens]
(let [file-id (get state :current-file-id)
current-page-id (get state :current-page-id)
fdata (dsh/lookup-file-data state file-id)
tpoint (dt/tpoint-ms)]
- (l/inf :status "START" :hint "update-tokens")
+ (l/inf :status "START" :hint "propagate-tokens")
(->> (rx/concat
(rx/of current-page-id)
(->> (rx/from (:pages fdata))
@@ -155,7 +156,7 @@
(actionize-shapes-update-info page-id attrs)]
(l/inf :status "PROGRESS"
- :hint "update-tokens"
+ :hint "propagate-tokens"
:page-id (str page-id)
:elapsed (tpoint)
::l/sync? true)
@@ -175,19 +176,21 @@
(rx/finalize
(fn [_]
(let [elapsed (tpoint)]
- (l/inf :status "END" :hint "update-tokens" :elapsed elapsed)))))))
+ (l/inf :status "END" :hint "propagate-tokens" :elapsed elapsed)))))))
-(defn update-workspace-tokens
+(defn propagate-workspace-tokens
[]
- (ptk/reify ::update-workspace-tokens
+ (ptk/reify ::propagate-workspace-tokens
ptk/WatchEvent
(watch [_ state _]
- (let [tokens (-> (wtts/get-active-theme-sets-tokens-names-map state)
- (wtsd/resolve-tokens+))]
- (->> (rx/from tokens)
- (rx/mapcat (fn [sd-tokens]
- (let [undo-id (js/Symbol)]
- (rx/concat
- (rx/of (dwu/start-undo-transaction undo-id :timeout false))
- (update-tokens state sd-tokens)
- (rx/of (dwu/commit-undo-transaction undo-id)))))))))))
+ (when-let [tokens-lib (-> (dsh/lookup-file-data state)
+ (get :tokens-lib))]
+ (let [tokens (-> (ctob/get-active-themes-set-tokens tokens-lib)
+ (sd/resolve-tokens+))]
+ (->> (rx/from tokens)
+ (rx/mapcat (fn [sd-tokens]
+ (let [undo-id (js/Symbol)]
+ (rx/concat
+ (rx/of (dwu/start-undo-transaction undo-id :timeout false))
+ (propagate-tokens state sd-tokens)
+ (rx/of (dwu/commit-undo-transaction undo-id))))))))))))
\ No newline at end of file
diff --git a/frontend/src/app/main/data/workspace/tokens/selected_set.cljs b/frontend/src/app/main/data/workspace/tokens/selected_set.cljs
index b8d02aa1bc..7969e3be10 100644
--- a/frontend/src/app/main/data/workspace/tokens/selected_set.cljs
+++ b/frontend/src/app/main/data/workspace/tokens/selected_set.cljs
@@ -11,7 +11,7 @@
[app.common.types.tokens-lib :as ctob]
[app.main.data.helpers :as dsh]))
-(defn get-selected-token-set-name [state]
+(defn- get-selected-token-set-name [state]
(or (get-in state [:workspace-tokens :selected-token-set-name])
(some-> (dsh/lookup-file-data state)
(get :tokens-lib)
diff --git a/frontend/src/app/main/ui/workspace/tokens/warnings.cljs b/frontend/src/app/main/data/workspace/tokens/warnings.cljs
similarity index 82%
rename from frontend/src/app/main/ui/workspace/tokens/warnings.cljs
rename to frontend/src/app/main/data/workspace/tokens/warnings.cljs
index b175d164aa..1849f824a2 100644
--- a/frontend/src/app/main/ui/workspace/tokens/warnings.cljs
+++ b/frontend/src/app/main/data/workspace/tokens/warnings.cljs
@@ -1,4 +1,10 @@
-(ns app.main.ui.workspace.tokens.warnings
+;; 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.tokens.warnings
(:require
[app.util.i18n :refer [tr]]
[cuerdas.core :as str]))
diff --git a/frontend/src/app/main/data/workspace/variants.cljs b/frontend/src/app/main/data/workspace/variants.cljs
index 1c38fc82f0..1566ba4e3f 100644
--- a/frontend/src/app/main/data/workspace/variants.cljs
+++ b/frontend/src/app/main/data/workspace/variants.cljs
@@ -8,13 +8,16 @@
(:require
[app.common.colors :as clr]
[app.common.data :as d]
- [app.common.data.macros :as dm]
[app.common.files.changes-builder :as pcb]
[app.common.files.helpers :as cfh]
- [app.common.logic.libraries :as cll]
+ [app.common.files.variant :as cfv]
+ [app.common.geom.point :as gpt]
+ [app.common.logic.variant-properties :as clvp]
[app.common.logic.variants :as clv]
[app.common.types.component :as ctc]
[app.common.types.components-list :as ctkl]
+ [app.common.types.shape.layout :as ctsl]
+ [app.common.types.variant :as ctv]
[app.common.uuid :as uuid]
[app.main.data.changes :as dch]
[app.main.data.helpers :as dsh]
@@ -23,23 +26,65 @@
[app.main.data.workspace.selection :as dws]
[app.main.data.workspace.shape-layout :as dwsl]
[app.main.data.workspace.shapes :as dwsh]
+ [app.main.data.workspace.transforms :as dwt]
[app.main.data.workspace.undo :as dwu]
[app.main.features :as features]
[app.util.dom :as dom]
[beicon.v2.core :as rx]
[potok.v2.core :as ptk]))
-(dm/export clv/find-related-components)
+(defn update-properties-names-and-values
+ "Compares the previous properties with the updated ones and executes the correspondent action
+ for each one depending on if it needs to be removed, updated or added"
+ [component-id variant-id previous-properties updated-properties]
+ (ptk/reify ::update-properties-names-and-values
+ ptk/UpdateEvent
+ (update [_ state]
+ (update state :workspace-local dissoc :shape-for-rename))
-(defn is-secondary-variant?
- [component data]
- (if-let [variant-id (:variant-id component)]
- (let [page-id (:main-instance-page component)
- objects (-> (dsh/get-page data page-id)
- (get :objects))
- shapes (dm/get-in objects [variant-id :shapes])]
- (not= (:main-instance-id component) (last shapes)))
- false))
+ ptk/WatchEvent
+ (watch [it state _]
+ (let [page-id (:current-page-id state)
+ data (dsh/lookup-file-data state)
+ objects (-> (dsh/get-page data page-id)
+ (get :objects))
+
+ properties-to-remove (ctv/find-properties-to-remove previous-properties updated-properties)
+ properties-to-add (ctv/find-properties-to-add previous-properties updated-properties)
+ properties-to-update (ctv/find-properties-to-update previous-properties updated-properties)
+
+ changes (-> (pcb/empty-changes it page-id)
+ (pcb/with-objects objects)
+ (pcb/with-library-data data))
+
+ changes (reduce
+ (fn [changes {:keys [name]}]
+ (-> changes
+ (clvp/generate-update-property-value component-id (ctv/find-index-for-property-name previous-properties name) "")))
+ changes
+ properties-to-remove)
+
+ changes (reduce
+ (fn [changes {:keys [name value]}]
+ (-> changes
+ (clvp/generate-update-property-value component-id (ctv/find-index-for-property-name previous-properties name) value)))
+ changes
+ properties-to-update)
+
+ changes (reduce
+ (fn [changes [idx {:keys [name value]}]]
+ (-> changes
+ (clvp/generate-add-new-property variant-id {:property-name name})
+ (clvp/generate-update-property-value component-id (+ idx (count previous-properties)) value)))
+ changes
+ (map-indexed vector properties-to-add))
+
+ undo-id (js/Symbol)]
+
+ (rx/of
+ (dwu/start-undo-transaction undo-id)
+ (dch/commit-changes changes)
+ (dwu/commit-undo-transaction undo-id))))))
(defn update-property-name
"Update the variant property name on the position pos
@@ -56,7 +101,7 @@
changes (-> (pcb/empty-changes it page-id)
(pcb/with-objects objects)
(pcb/with-library-data data)
- (clv/generate-update-property-name variant-id pos new-name))
+ (clvp/generate-update-property-name variant-id pos new-name))
undo-id (js/Symbol)]
(rx/of
(dwu/start-undo-transaction undo-id)
@@ -77,7 +122,7 @@
changes (-> (pcb/empty-changes it page-id)
(pcb/with-library-data data)
(pcb/with-objects objects)
- (clv/generate-update-property-value component-id pos value))
+ (clvp/generate-update-property-value component-id pos value))
undo-id (js/Symbol)]
(rx/of
(dwu/start-undo-transaction undo-id)
@@ -100,7 +145,7 @@
changes (-> (pcb/empty-changes it page-id)
(pcb/with-library-data data)
(pcb/with-objects objects)
- (clv/generate-remove-property variant-id pos))
+ (clvp/generate-remove-property variant-id pos))
undo-id (js/Symbol)]
(rx/of
@@ -124,7 +169,7 @@
changes (-> (pcb/empty-changes it page-id)
(pcb/with-library-data data)
(pcb/with-objects objects)
- (clv/generate-add-new-property variant-id options))
+ (clvp/generate-add-new-property variant-id options))
undo-id (js/Symbol)]
(rx/of
@@ -132,7 +177,7 @@
(dch/commit-changes changes)
(dwu/commit-undo-transaction undo-id))))))
-(defn set-variant-id
+(defn- set-variant-id
"Sets the variant-id on a component"
[component-id variant-id]
(ptk/reify ::set-variant-id
@@ -149,7 +194,7 @@
(dch/commit-changes changes)
(dwu/commit-undo-transaction undo-id))))))
-(defn focus-property
+(defn- focus-property
[shape-id prop-num]
(ptk/reify ::focus-property
ptk/EffectEvent
@@ -157,6 +202,25 @@
(dom/focus! (dom/get-element (str "variant-prop-" shape-id prop-num))))))
+(defn- resposition-and-resize-variant
+ "Resize the variant container, and move the shape (that is a variant) to the right"
+ [shape-id]
+ (ptk/reify ::resposition-and-resize-variant
+ ptk/WatchEvent
+ (watch [_ state _]
+ (let [page-id (:current-page-id state)
+ objects (dsh/lookup-page-objects state page-id)
+ shape (get objects shape-id)
+ container (get objects (:parent-id shape))
+ width (+ (:width container) (:width shape) 20) ;; 20 is the default gap for variants
+ x (- width (+ (:width shape) 30))] ;; 30 is the default margin for variants
+ (rx/of
+ (dwt/update-dimensions [(:parent-id shape)] :width width)
+ (dwt/update-position shape-id
+ {:x x}
+ {:absolute? false}))))))
+
+
(defn add-new-variant
"Create a new variant and add it to the variant-container"
[shape-id]
@@ -174,39 +238,28 @@
component-id (:component-id shape)
component (ctkl/get-component data component-id)
+ container-id (:parent-id shape)
+ variant-container (get objects container-id)
+ has-layout? (ctsl/any-layout? variant-container)
+
new-component-id (uuid/next)
new-shape-id (uuid/next)
- value (str clv/value-prefix
- (-> (clv/extract-properties-values data objects (:variant-id component))
- last
- :value
- count
- inc))
-
prop-num (dec (count (:variant-properties component)))
-
- [new-shape changes] (-> (pcb/empty-changes it page-id)
+ changes (-> (pcb/empty-changes it page-id)
(pcb/with-library-data data)
(pcb/with-objects objects)
(pcb/with-page-id page-id)
- (cll/generate-duplicate-component
- {:data data}
- component-id
- new-component-id
- true
- {:new-shape-id new-shape-id :apply-changes-local-library? true}))
-
- changes (-> changes
- (clv/generate-update-property-value new-component-id prop-num value)
- (pcb/change-parent (:parent-id shape) [new-shape] 0))
+ (clv/generate-add-new-variant shape (:variant-id component) new-component-id new-shape-id prop-num))
undo-id (js/Symbol)]
(rx/concat
(rx/of
(dwu/start-undo-transaction undo-id)
(dch/commit-changes changes)
+ (when-not has-layout?
+ (resposition-and-resize-variant new-shape-id))
(dwu/commit-undo-transaction undo-id)
(ptk/data-event :layout/update {:ids [(:parent-id shape)]})
(dws/select-shape new-shape-id))
@@ -226,7 +279,7 @@
page-id (:current-page-id state)
objects (dsh/lookup-page-objects state file-id page-id)
main (get objects main-instance-id)
- main-id (:id main)
+ parent (get objects (:parent-id main))
component-id (:component-id main)
cpath (cfh/split-path (:name main))
name (first cpath)
@@ -250,9 +303,17 @@
:stroke-color "#bb97d8" ;; todo use color var?
:stroke-opacity 1
:stroke-width 2}
+
+ ;; Move the position of the variant container so the main shape doesn't
+ ;; change its position
+ delta (if (ctsl/any-layout? parent)
+ (gpt/point 0 0)
+ (gpt/point -30 -30))
undo-id (js/Symbol)]
+ ;;TODO Refactor all called methods in order to be able to
+ ;;generate changes instead of call the events
(rx/concat
(rx/of
(dwu/start-undo-transaction undo-id)
@@ -261,11 +322,11 @@
(dwl/rename-component component-id name))
;; Create variant container
- (dwsh/create-artboard-from-selection variant-id)
+ (dwsh/create-artboard-from-selection variant-id nil nil nil delta)
(cl/remove-all-fills variant-vec {:color clr/black :opacity 1})
(dwsl/create-layout-from-id variant-id :flex)
(dwsh/update-shapes variant-vec #(merge % cont-props))
- (dwsh/update-shapes [main-id] #(merge % main-props))
+ (dwsh/update-shapes [main-instance-id] #(merge % main-props))
(cl/add-stroke variant-vec stroke-props)
(set-variant-id component-id variant-id))
@@ -283,9 +344,11 @@
(rx/of
(add-new-variant main-instance-id)
- (dwu/commit-undo-transaction undo-id)))))))
+ (dwu/commit-undo-transaction undo-id)
+ (ptk/data-event :layout/update {:ids [variant-id]})))))))
(defn add-component-or-variant
+ "Manage the shared shortcut, and do the pertinent action"
[]
(ptk/reify ::add-component-or-variant
@@ -319,6 +382,7 @@
(rx/of (dwl/add-component)))))))
(defn duplicate-or-add-variant
+ "Manage the shared shortcut, and do the pertinent action"
[]
(ptk/reify ::duplicate-or-add-variant
ptk/WatchEvent
@@ -336,3 +400,43 @@
(rx/from (map add-new-variant selected-ids))
(rx/of (dwu/commit-undo-transaction undo-id)))
(rx/of (dws/duplicate-selected true)))))))
+
+
+(defn rename-variant
+ "Rename the variant container and all components belonging to this variant"
+ [variant-id name]
+ (ptk/reify ::rename-variant
+
+ ptk/WatchEvent
+ (watch [_ state _]
+ (let [page-id (:current-page-id state)
+ data (dsh/lookup-file-data state)
+ objects (-> (dsh/get-page data page-id)
+ (get :objects))
+ variant-components (cfv/find-variant-components data objects variant-id)
+ clean-name (cfh/clean-path name)
+ undo-id (js/Symbol)]
+
+ (rx/concat
+ (rx/of (dwu/start-undo-transaction undo-id)
+ (dwsh/update-shapes [variant-id] #(assoc % :name clean-name)))
+ (rx/from (map
+ #(dwl/rename-component-and-main-instance (:id %) clean-name)
+ variant-components))
+ (rx/of (dwu/commit-undo-transaction undo-id)))))))
+
+
+(defn rename-comp-or-variant-and-main
+ "If the component is in a variant, rename the variant.
+ If it is not, rename the component and its main"
+ [component-id name]
+ (ptk/reify ::rename-comp-or-variant-and-main
+
+ ptk/WatchEvent
+ (watch [_ state _]
+ (let [data (dsh/lookup-file-data state)
+ component (ctkl/get-component data component-id)]
+ (if (ctc/is-variant? component)
+ (rx/of (rename-variant (:variant-id component) name))
+ (rx/of (dwl/rename-component-and-main-instance component-id name)))))))
+
diff --git a/frontend/src/app/main/errors.cljs b/frontend/src/app/main/errors.cljs
index 5ad3c84a22..d8c6b7db10 100644
--- a/frontend/src/app/main/errors.cljs
+++ b/frontend/src/app/main/errors.cljs
@@ -260,6 +260,14 @@
(let [message (tr "errors.feature-not-supported" (:feature error))]
(st/emit! (modal/show {:type :alert :message message})))
+ (= :file-in-components-v1 code)
+ (st/emit! (modal/show {:type :alert
+ :message (tr "errors.deprecated")
+ :link-message {:before (tr "errors.deprecated.contact.before")
+ :text (tr "errors.deprecated.contact.text")
+ :after (tr "errors.deprecated.contact.after")
+ :on-click #(st/emit! (rt/nav :settings-feedback))}}))
+
:else
(print-cause! "Restriction Error" error)))
diff --git a/frontend/src/app/main/fonts.clj b/frontend/src/app/main/fonts.clj
index 43b9fb7916..80f4ca0a05 100644
--- a/frontend/src/app/main/fonts.clj
+++ b/frontend/src/app/main/fonts.clj
@@ -7,33 +7,38 @@
(ns app.main.fonts
"A fonts loading macros."
(:require
+ [app.common.uuid :as uuid]
[clojure.data.json :as json]
[clojure.java.io :as io]
[cuerdas.core :as str]))
(defn- parse-gfont-variant
- [variant]
+ [variant files]
(cond
(= "regular" variant)
- {:id "regular" :name "regular" :weight "400" :style "normal"}
+ {:id "regular" :name "regular" :weight "400" :style "normal" :ttf-url (get files "regular")}
(= "italic" variant)
- {:id "italic" :name "italic" :weight "400" :style "italic"}
+ {:id "italic" :name "italic" :weight "400" :style "italic" :ttf-url (get files "italic")}
:else
- (when-let [[a b c] (re-find #"^(\d+)(.*)$" variant)]
- (if (str/empty? c)
- {:id a :name b :weight b :style "normal"}
- {:id a :name (str b " (" c ")") :weight b :style c}))))
+ (when-let [[id weight style] (re-find #"^(\d+)(.*)$" variant)]
+ {:id id
+ :name variant
+ :weight weight
+ :style (if (str/empty? style) "normal" style)
+ :ttf-url (get files id)})))
(defn- parse-gfont
[font]
(let [family (get font "family")
- variants (get font "variants")]
+ variants (get font "variants")
+ files (get font "files")]
{:id (str "gfont-" (str/slug family))
+ :uuid (uuid/random)
:family family
:name family
- :variants (into [] (comp (map parse-gfont-variant)
+ :variants (into [] (comp (map (fn [variant] (parse-gfont-variant variant files)))
(filter identity))
variants)}))
diff --git a/frontend/src/app/main/fonts.cljs b/frontend/src/app/main/fonts.cljs
index 5b06f449b4..4ee3c80b39 100644
--- a/frontend/src/app/main/fonts.cljs
+++ b/frontend/src/app/main/fonts.cljs
@@ -33,16 +33,16 @@
:name "Source Sans Pro"
:family "sourcesanspro"
:variants
- [{:id "200" :name "200" :weight "200" :style "normal" :suffix "extralight"}
- {:id "200italic" :name "200 (italic)" :weight "200" :style "italic" :suffix "extralightitalic"}
- {:id "300" :name "300" :weight "300" :style "normal" :suffix "light"}
- {:id "300italic" :name "300 (italic)" :weight "300" :style "italic" :suffix "lightitalic"}
- {:id "regular" :name "regular" :weight "400" :style "normal"}
- {:id "italic" :name "italic" :weight "400" :style "italic"}
- {:id "bold" :name "bold" :weight "bold" :style "normal"}
- {:id "bolditalic" :name "bold (italic)" :weight "bold" :style "italic"}
- {:id "black" :name "black" :weight "900" :style "normal"}
- {:id "blackitalic" :name "black (italic)" :weight "900" :style "italic"}]}])
+ [{:id "200" :name "200" :weight "200" :style "normal" :suffix "extralight" :ttf-url "sourcesanspro-extralight.ttf"}
+ {:id "200italic" :name "200 (italic)" :weight "200" :style "italic" :suffix "extralightitalic" :ttf-url "sourcesanspro-extralightitalic.ttf"}
+ {:id "300" :name "300" :weight "300" :style "normal" :suffix "light" :ttf-url "sourcesanspro-light.ttf"}
+ {:id "300italic" :name "300 (italic)" :weight "300" :style "italic" :suffix "lightitalic" :ttf-url "sourcesanspro-lightitalic.ttf"}
+ {:id "regular" :name "regular" :weight "400" :style "normal" :ttf-url "sourcesanspro-regular.ttf"}
+ {:id "italic" :name "italic" :weight "400" :style "italic" :ttf-url "sourcesanspro-italic.ttf"}
+ {:id "bold" :name "bold" :weight "bold" :style "normal" :ttf-url "sourcesanspro-bold.ttf"}
+ {:id "bolditalic" :name "bold (italic)" :weight "bold" :style "italic" :ttf-url "sourcesanspro-bolditalic.ttf"}
+ {:id "black" :name "black" :weight "900" :style "normal" :ttf-url "sourcesanspro-black.ttf"}
+ {:id "blackitalic" :name "black (italic)" :weight "900" :style "italic" :ttf-url "sourcesanspro-blackitalic.ttf"}]}])
(defonce fontsdb (l/atom {}))
(defonce fonts (l/atom []))
diff --git a/frontend/src/app/main/ui.cljs b/frontend/src/app/main/ui.cljs
index 143dec77a1..f43e86cbae 100644
--- a/frontend/src/app/main/ui.cljs
+++ b/frontend/src/app/main/ui.cljs
@@ -194,6 +194,7 @@
:settings-password
:settings-options
:settings-feedback
+ :settings-subscription
:settings-access-tokens
:settings-notifications)
[:? [:& settings-page {:route route}]]
diff --git a/frontend/src/app/main/ui/alert.cljs b/frontend/src/app/main/ui/alert.cljs
index 821b97cee1..8dd9542493 100644
--- a/frontend/src/app/main/ui/alert.cljs
+++ b/frontend/src/app/main/ui/alert.cljs
@@ -9,6 +9,8 @@
(:require
[app.main.data.modal :as modal]
[app.main.store :as st]
+ [app.main.ui.components.link :as lk]
+ [app.main.ui.ds.notifications.context-notification :refer [context-notification*]]
[app.main.ui.icons :as i]
[app.util.dom :as dom]
[app.util.i18n :as i18n :refer [tr]]
@@ -21,6 +23,7 @@
::mf/register-as :alert}
[{:keys [message
scd-message
+ link-message
title
on-accept
hint
@@ -59,10 +62,20 @@
[:div {:class (stl/css :modal-content)}
(when (and (string? message) (not= message ""))
[:h3 {:class (stl/css :modal-msg)} message])
+ (when (seq link-message)
+ [:h3 {:class (stl/css :modal-msg)}
+ [:span (:before link-message)]
+ [:& lk/link {:action (:on-click link-message)
+ :class (stl/css :link)}
+ (:text link-message)]
+ [:span (:after link-message)]])
(when (and (string? scd-message) (not= scd-message ""))
[:h3 {:class (stl/css :modal-scd-msg)} scd-message])
+
(when (string? hint)
- [:p {:class (stl/css :modal-hint)} hint])]
+ [:> context-notification* {:level :info
+ :appearance :ghost}
+ hint])]
[:div {:class (stl/css :modal-footer)}
[:div {:class (stl/css :action-buttons)}
diff --git a/frontend/src/app/main/ui/alert.scss b/frontend/src/app/main/ui/alert.scss
index 33e202118d..6955de2517 100644
--- a/frontend/src/app/main/ui/alert.scss
+++ b/frontend/src/app/main/ui/alert.scss
@@ -8,10 +8,12 @@
.modal-overlay {
@extend .modal-overlay-base;
+
&.transparent {
background-color: transparent;
}
}
+
.modal-container {
@extend .modal-container-base;
}
@@ -34,10 +36,6 @@
margin-bottom: $s-24;
}
-.modal-hint {
- @include bodyLargeTypography;
-}
-
.action-buttons {
@extend .modal-action-btns;
}
@@ -48,6 +46,7 @@
.accept-btn {
@extend .modal-accept-btn;
+
&.danger {
@extend .modal-danger-btn;
}
@@ -60,3 +59,15 @@
color: var(--modal-text-foreground-color);
line-height: 1.5;
}
+
+.link {
+ color: var(--color-accent-primary);
+}
+
+.link::before {
+ content: " ";
+}
+
+.link::after {
+ content: " ";
+}
diff --git a/frontend/src/app/main/ui/comments.cljs b/frontend/src/app/main/ui/comments.cljs
index 1aa3c833e3..479c810cd4 100644
--- a/frontend/src/app/main/ui/comments.cljs
+++ b/frontend/src/app/main/ui/comments.cljs
@@ -450,7 +450,6 @@
(mf/defc mentions-panel*
[]
(let [mentions-s (mf/use-ctx mentions-context)
- profile (mf/deref refs/profile)
team (mf/deref refs/team)
members (:members team)
@@ -467,13 +466,11 @@
mentions-users
(mf/with-memo [mention-filter members]
(->> members
- (filter (fn [{:keys [id fullname email]}]
- (and
- (not= id (:id profile))
- (or (not mention-filter)
- (empty? mention-filter)
- (str/includes? (str/lower fullname) (str/lower mention-filter))
- (str/includes? (str/lower email) (str/lower mention-filter))))))
+ (filter (fn [{:keys [fullname email]}]
+ (or (not mention-filter)
+ (empty? mention-filter)
+ (str/includes? (str/lower fullname) (str/lower mention-filter))
+ (str/includes? (str/lower email) (str/lower mention-filter)))))
(take 4)
(into [])))
@@ -762,9 +759,29 @@
[:> comment-form-buttons* {:on-submit on-submit*
:on-cancel on-cancel
:is-disabled disabled?}]]))
+(defn- offset-position [position viewport zoom bubble-margin]
+ (let [viewport (or viewport {:offset-x 0 :offset-y 0 :width 0 :height 0})
+ base-x (+ (* (:x position) zoom) (:offset-x viewport))
+ base-y (+ (* (:y position) zoom) (:offset-y viewport))
+
+ x (:x position)
+ y (:y position)
+
+ w (:width viewport)
+ h (:height viewport)
+
+ comment-width 284 ;; TODO: this is the width set via CSS in an outer container…
+ ;; We should probably do this in a different way.
+
+ orientation-left? (>= (+ base-x comment-width (:x bubble-margin)) w)
+ orientation-top? (>= base-y (/ h 2))
+
+ h-dir (if orientation-left? :left :right)
+ v-dir (if orientation-top? :top :bottom)]
+ {:x x :y y :h-dir h-dir :v-dir v-dir}))
(mf/defc comment-floating-thread-draft*
- [{:keys [draft zoom on-cancel on-submit position-modifier]}]
+ [{:keys [draft zoom on-cancel on-submit position-modifier viewport]}]
(let [profile (mf/deref refs/profile)
mentions-s (mf/use-memo #(rx/subject))
@@ -773,9 +790,14 @@
(some? position-modifier)
(gpt/transform position-modifier))
content (:content draft)
+ bubble-margin (gpt/point 0 0)
- pos-x (* (:x position) zoom)
- pos-y (* (:y position) zoom)
+ pos (offset-position position viewport zoom bubble-margin)
+
+ margin-x (* (:x bubble-margin) (if (= (:h-dir pos) :left) -1 1))
+ margin-y (* (:y bubble-margin) (if (= (:v-dir pos) :top) -1 1))
+ pos-x (+ (* (:x pos) zoom) margin-x)
+ pos-y (- (* (:y pos) zoom) margin-y)
disabled? (or (blank-content? content)
(exceeds-length? content))
@@ -802,33 +824,39 @@
(on-submit draft)))]
[:> (mf/provider mentions-context) {:value mentions-s}
- [:div
- {:class (stl/css :floating-preview-wrapper)
- :data-testid "floating-thread-bubble"
- :style {:top (str pos-y "px")
- :left (str pos-x "px")}
- :on-click dom/stop-propagation}
- [:> comment-avatar* {:class (stl/css :avatar-lg)
- :image (cfg/resolve-profile-photo-url profile)}]]
- [:div {:class (stl/css :floating-thread-wrapper :cursor-auto)
- :style {:top (str (- pos-y 24) "px")
- :left (str (+ pos-x 28) "px")}
- :on-click dom/stop-propagation}
- [:div {:class (stl/css :form)}
- [:> comment-input*
- {:placeholder (tr "labels.write-new-comment")
- :value (or content "")
- :autofocus true
- :on-esc on-esc
- :on-change on-change
- :on-ctrl-enter on-submit*}]
- (when (exceeds-length? content)
- [:div {:class (stl/css :error-text)}
- (tr "errors.character-limit-exceeded")])
- [:> comment-form-buttons* {:on-submit on-submit*
- :on-cancel on-esc
- :is-disabled disabled?}]]
- [:> mentions-panel*]]]))
+ [:div {:class (stl/css-case :floating-thread-draft-wrapper true
+ :left (= (:h-dir pos) :left)
+ :top (= (:v-dir pos) :top))
+ :style {:top (str pos-y "px")
+ :left (str pos-x "px")}}
+ [:div
+ {:data-testid "floating-thread-bubble"
+ :style {:top (str pos-y "px")
+ :left (str pos-x "px")}
+ :on-click dom/stop-propagation}
+ [:> comment-avatar* {:class (stl/css :avatar-lg)
+ :image (cfg/resolve-profile-photo-url profile)}]]
+ [:div {:class (stl/css :floating-thread-draft-inner-wrapper
+ :cursor-auto)
+ :style {:top (str (- pos-y 24) "px")
+ :left (str (+ pos-x 28) "px")}
+
+ :on-click dom/stop-propagation}
+ [:div {:class (stl/css :form)}
+ [:> comment-input*
+ {:placeholder (tr "labels.write-new-comment")
+ :value (or content "")
+ :autofocus true
+ :on-esc on-esc
+ :on-change on-change
+ :on-ctrl-enter on-submit*}]
+ (when (exceeds-length? content)
+ [:div {:class (stl/css :error-text)}
+ (tr "errors.character-limit-exceeded")])
+ [:> comment-form-buttons* {:on-submit on-submit*
+ :on-cancel on-esc
+ :is-disabled disabled?}]]
+ [:> mentions-panel*]]]]))
(mf/defc comment-floating-thread-header*
{::mf/private true}
@@ -980,26 +1008,7 @@
[thread-id]
(l/derived (l/in [:comments thread-id]) st/state))
-(defn- offset-position [position viewport zoom bubble-margin]
- (let [viewport (or viewport {:offset-x 0 :offset-y 0 :width 0 :height 0})
- base-x (+ (* (:x position) zoom) (:offset-x viewport))
- base-y (+ (* (:y position) zoom) (:offset-y viewport))
- x (:x position)
- y (:y position)
-
- w (:width viewport)
- h (:height viewport)
-
- comment-width 284 ;; TODO: this is the width set via CSS in an outer container…
- ;; We should probably do this in a different way.
-
- orientation-left? (>= (+ base-x comment-width (:x bubble-margin)) w)
- orientation-top? (>= base-y (/ h 2))
-
- h-dir (if orientation-left? :left :right)
- v-dir (if orientation-top? :top :bottom)]
- {:x x :y y :h-dir h-dir :v-dir v-dir}))
(mf/defc comment-floating-thread*
{::mf/wrap [mf/memo]}
diff --git a/frontend/src/app/main/ui/comments.scss b/frontend/src/app/main/ui/comments.scss
index 4e4eb43455..8ca32f61b7 100644
--- a/frontend/src/app/main/ui/comments.scss
+++ b/frontend/src/app/main/ui/comments.scss
@@ -160,6 +160,40 @@
z-index: initial;
}
+.floating-thread-draft-wrapper {
+ position: absolute;
+ display: flex;
+ flex-direction: row;
+ column-gap: $s-12;
+
+ --translate-x: 0%;
+ --translate-y: 0%;
+ transform: translate(var(--translate-x), var(--translate-y));
+
+ &.left {
+ --translate-x: -100%;
+ flex-direction: row-reverse;
+ }
+
+ &.top {
+ --translate-y: -100%;
+ align-items: flex-end;
+ }
+}
+
+.floating-thread-draft-inner-wrapper {
+ display: flex;
+ flex-direction: column;
+ gap: $s-12;
+ width: $s-284;
+ padding: $s-8 $s-12 $s-8 $s-12;
+ pointer-events: auto;
+ border-radius: $br-8;
+ border: $s-2 solid var(--modal-border-color);
+ background-color: var(--comment-modal-background-color);
+ max-height: var(--comment-height);
+}
+
.floating-preview-displacement {
margin-left: calc(-1 * ($s-12 + $s-2));
margin-top: calc(-1 * ($s-8 + $s-2));
@@ -177,6 +211,7 @@
border: $s-2 solid var(--modal-border-color);
background-color: var(--comment-modal-background-color);
max-height: var(--comment-height);
+
--translate-x: 0%;
--translate-y: 0%;
transform: translate(var(--translate-x), var(--translate-y));
diff --git a/frontend/src/app/main/ui/confirm.cljs b/frontend/src/app/main/ui/confirm.cljs
index abb11ea8c7..9f97146c87 100644
--- a/frontend/src/app/main/ui/confirm.cljs
+++ b/frontend/src/app/main/ui/confirm.cljs
@@ -9,6 +9,7 @@
(:require
[app.main.data.modal :as modal]
[app.main.store :as st]
+ [app.main.ui.ds.notifications.context-notification :refer [context-notification*]]
[app.main.ui.icons :as i]
[app.util.dom :as dom]
[app.util.i18n :as i18n :refer [tr]]
@@ -76,7 +77,9 @@
(when (and (string? scd-message) (not= scd-message ""))
[:h3 {:class (stl/css :modal-scd-msg)} scd-message])
(when (string? hint)
- [:p {:class (stl/css :modal-hint)} hint])
+ [:> context-notification* {:level :info
+ :appearance :ghost}
+ hint])
(when (> (count items) 0)
[:*
[:p {:class (stl/css :modal-subtitle)}
diff --git a/frontend/src/app/main/ui/confirm.scss b/frontend/src/app/main/ui/confirm.scss
index 0b4b08202b..3dfec11100 100644
--- a/frontend/src/app/main/ui/confirm.scss
+++ b/frontend/src/app/main/ui/confirm.scss
@@ -52,10 +52,6 @@
@include bodyLargeTypography;
}
-.modal-hint {
- @extend .modal-hint-base;
-}
-
.action-buttons {
@extend .modal-action-btns;
}
diff --git a/frontend/src/app/main/ui/context.cljs b/frontend/src/app/main/ui/context.cljs
index abee67fb4f..4e97749e9a 100644
--- a/frontend/src/app/main/ui/context.cljs
+++ b/frontend/src/app/main/ui/context.cljs
@@ -23,7 +23,6 @@
(def render-thumbnails (mf/create-context nil))
(def libraries (mf/create-context nil))
-(def components-v2 (mf/create-context nil))
(def design-tokens (mf/create-context nil))
(def current-scroll (mf/create-context nil))
diff --git a/frontend/src/app/main/ui/dashboard/grid.cljs b/frontend/src/app/main/ui/dashboard/grid.cljs
index 450bcd0f33..df094bca80 100644
--- a/frontend/src/app/main/ui/dashboard/grid.cljs
+++ b/frontend/src/app/main/ui/dashboard/grid.cljs
@@ -161,7 +161,7 @@
[:span {:class (stl/css :num-assets)} (str "\u00A0(") (:count components) ")"]] ;; Unicode 00A0 is non-breaking space
[:div {:class (stl/css :asset-list)}
(for [component (:sample components)]
- (let [root-id (or (:main-instance-id component) (:id component))] ;; Check for components-v2 in library
+ (let [root-id (:main-instance-id component)]
[:div {:class (stl/css :asset-list-item)
:key (str "assets-component-" (:id component))}
[:& render/component-svg {:root-shape (get-in component [:objects root-id])
diff --git a/frontend/src/app/main/ui/dashboard/import.cljs b/frontend/src/app/main/ui/dashboard/import.cljs
index dc0afa8ca0..e515ea93a0 100644
--- a/frontend/src/app/main/ui/dashboard/import.cljs
+++ b/frontend/src/app/main/ui/dashboard/import.cljs
@@ -291,7 +291,7 @@
import-error?
[:div {:class (stl/css :error-message)}
- (tr "dashboard.import.import-error")]
+ (tr "labels.error")]
(and (not import-success?) (some? progress))
[:div {:class (stl/css :progress-message)} (parse-progress-message progress)])
@@ -443,7 +443,12 @@
(and (seq entries)
(every? #(= :import-success (:status %)) entries))
- (reset! status* :import-success)))
+ (reset! status* :import-success)
+
+ (and (seq entries)
+ (and (every? #(not= :import-ready (:status %)) entries)
+ (some #(= :import-error (:status %)) entries)))
+ (reset! status* :import-error)))
;; Run analyze operation on component mount
(mf/with-effect []
@@ -469,15 +474,30 @@
{:level (if (zero? import-success-total) :warning :success)
:content (tr "dashboard.import.import-message" (i18n/c import-success-total))}])
- (for [entry entries]
- [:> import-entry* {:edition edition
- :key (dm/str (:uri entry) "/" (:file-id entry))
- :entry entry
- :entries entries
- :on-edit on-edit
- :on-change on-entry-change
- :on-delete on-entry-delete
- :can-be-deleted (> (count entries) 1)}])
+ (when (= :import-error status)
+ [:& context-notification
+ {:level :error
+ :class (stl/css :context-notification-error)
+ :content (tr "dashboard.import.import-error.disclaimer")}])
+
+ (if (= :import-error status)
+ [:div {:class (stl/css :import-error-disclaimer)}
+ [:div (tr "dashboard.import.import-error.message1")]
+ [:ul {:class (stl/css :import-error-list)}
+ (for [entry entries]
+ (when (= :import-error (:status entry))
+ [:li {:class (stl/css :import-error-list-enry)} (:name entry)]))]
+ [:div (tr "dashboard.import.import-error.message2")]]
+
+ (for [entry entries]
+ [:> import-entry* {:edition edition
+ :key (dm/str (:uri entry) "/" (:file-id entry))
+ :entry entry
+ :entries entries
+ :on-edit on-edit
+ :on-change on-entry-change
+ :on-delete on-entry-delete
+ :can-be-deleted (> (count entries) 1)}]))
(when (some? template)
[:> import-entry* {:entry (assoc template :status status)
@@ -499,6 +519,7 @@
:on-click on-continue}])
(when (or (= :import-success status)
+ (= :import-error status)
(= :import-progress status))
[:input {:class (stl/css :accept-btn)
:type "button"
diff --git a/frontend/src/app/main/ui/dashboard/import.scss b/frontend/src/app/main/ui/dashboard/import.scss
index 257134dc4b..0ce6ae41a5 100644
--- a/frontend/src/app/main/ui/dashboard/import.scss
+++ b/frontend/src/app/main/ui/dashboard/import.scss
@@ -192,3 +192,20 @@
}
}
}
+
+.context-notification-error {
+ --context-notification-bg-color: var(--modal-background-color);
+}
+
+.import-error-disclaimer {
+ color: var(--color-foreground-secondary);
+}
+
+.import-error-list {
+ padding: 0 var(--sp-l);
+ list-style: disc;
+}
+
+.import-error-list-enry {
+ padding: var(--sp-xs) 0;
+}
diff --git a/frontend/src/app/main/ui/dashboard/sidebar.cljs b/frontend/src/app/main/ui/dashboard/sidebar.cljs
index 0a6d07c8b9..32386ef988 100644
--- a/frontend/src/app/main/ui/dashboard/sidebar.cljs
+++ b/frontend/src/app/main/ui/dashboard/sidebar.cljs
@@ -26,6 +26,7 @@
[app.main.ui.dashboard.comments :refer [comments-icon* comments-section]]
[app.main.ui.dashboard.inline-edition :refer [inline-edition]]
[app.main.ui.dashboard.project-menu :refer [project-menu*]]
+ [app.main.ui.dashboard.subscription :as subscription]
[app.main.ui.dashboard.team-form]
[app.main.ui.icons :as i :refer [icon-xref]]
[app.util.dom :as dom]
@@ -962,6 +963,10 @@
(dom/open-new-window "https://penpot.app/pricing")))]
[:*
+ (when (contains? cf/flags :subscriptions)
+ [:> subscription/sidebar*])
+
+ ;; TODO remove this block when subscriptions is full implemented
(when (contains? cf/flags :subscriptions-old)
[:button {:class (stl/css :upgrade-plan-section)
:on-click on-power-up-click}
@@ -970,6 +975,7 @@
[:span {:class (stl/css :no-limits)} (tr "dashboard.upgrade-plan.no-limits")]]
[:div {:class (stl/css :power-up)}
(tr "dashboard.upgrade-plan.power-up")]])
+
(when (and team profile)
[:& comments-section
{:profile profile
diff --git a/frontend/src/app/main/ui/dashboard/subscription.cljs b/frontend/src/app/main/ui/dashboard/subscription.cljs
new file mode 100644
index 0000000000..ba2dccdb57
--- /dev/null
+++ b/frontend/src/app/main/ui/dashboard/subscription.cljs
@@ -0,0 +1,78 @@
+;; Copyright (c) KALEIDOS INC
+
+(ns app.main.ui.dashboard.subscription
+ (:require-macros [app.main.style :as stl])
+ (:require
+ [app.main.router :as rt]
+ [app.main.store :as st]
+ [app.main.ui.icons :as i]
+ [app.util.dom :as dom]
+ [app.util.i18n :as i18n :refer [tr]]
+ [rumext.v2 :as mf]))
+
+(mf/defc cta-power-up*
+ [{:keys [top-title top-description bottom-description cta-text cta-link has-dropdown]}]
+ (let [show-data* (mf/use-state false)
+ show-data (deref show-data*)
+ handle-click
+ (mf/use-fn
+ (fn [event]
+ (dom/stop-propagation event)
+ (swap! show-data* not)))]
+
+ [:div {:class (stl/css :cta-power-up)
+ :on-click handle-click}
+ [:button {:class (stl/css :cta-top-section)}
+ [:div {:class (stl/css :content)}
+ [:span {:class (stl/css :cta-title)} top-title]
+ [:span {:class (stl/css :cta-text)} top-description]]
+ (when has-dropdown [:span {:class (stl/css :icon-dropdown)} i/arrow])]
+
+ (when (and has-dropdown show-data)
+ [:div {:class (stl/css :cta-bottom-section)}
+ [:> i18n/tr-html* {:content bottom-description
+ :class (stl/css :content)
+ :tag-name "button"}]
+ [:button {:class (stl/css :cta-highlight :cta-link) :on-click cta-link}
+ cta-text]])]))
+
+(mf/defc sidebar*
+ []
+ (let [;; TODO subscription cases professional/unlimited/enterprise
+ subscription-name :unlimited
+ subscription-is-trial false
+
+ go-to-subscription
+ (mf/use-fn #(st/emit! (rt/nav :settings-subscription)))]
+
+ (case subscription-name
+ :professional
+ [:> cta-power-up*
+ {:top-title (tr "subscription.dashboard.power-up.professional.top-title")
+ :top-description (tr "dashboard.upgrade-plan.no-limits")
+ :bottom-description (tr "subscription.dashboard.power-up.professional.bottom-description")
+ :cta-text (tr "dashboard.upgrade-plan.power-up")
+ :cta-link go-to-subscription
+ :has-dropdown true}]
+
+ :unlimited
+ (if subscription-is-trial
+ [:> cta-power-up*
+ {:top-title (tr "subscription.dashboard.power-up.trial.top-title")
+ :top-description (tr "subscription.dashboard.power-up.trial.top-description")
+ :bottom-description (tr "subscription.dashboard.power-up.trial.bottom-description")
+ :cta-text (tr "subscription.dashboard.power-up.subscribe")}]
+
+ [:> cta-power-up*
+ {:top-title (tr "subscription.dashboard.power-up.unlimited-plan")
+ :top-description (tr "subscription.dashboard.power-up.unlimited.top-description")
+ :bottom-description (tr "subscription.dashboard.power-up.unlimited.bottom-description")
+ :cta-text (tr "subscription.dashboard.power-up.unlimited.cta")
+ :cta-link go-to-subscription
+ :has-dropdown true}])
+
+ :enterprise
+ [:> cta-power-up*
+ {:top-title (tr "subscription.dashboard.power-up.enterprise-plan")
+ :top-description (tr "subscription.dashboard.power-up.enterprise.description")
+ :has-dropdown false}])))
diff --git a/frontend/src/app/main/ui/dashboard/subscription.scss b/frontend/src/app/main/ui/dashboard/subscription.scss
new file mode 100644
index 0000000000..2da07be401
--- /dev/null
+++ b/frontend/src/app/main/ui/dashboard/subscription.scss
@@ -0,0 +1,78 @@
+@use "common/refactor/common-refactor.scss" as *;
+@use "common/refactor/common-dashboard";
+@use "../ds/typography.scss" as t;
+@use "../ds/_borders.scss" as *;
+
+.cta-power-up {
+ display: flex;
+ border: $b-1 solid var(--color-background-quaternary);
+ border-radius: var(--sp-s);
+ flex-direction: column;
+ margin: var(--sp-m);
+ padding: var(--sp-m);
+}
+
+.cta-top-section {
+ @include buttonStyle;
+ display: grid;
+ color: var(--color-foreground-secondary);
+ grid-template-columns: 1fr auto;
+}
+
+.cta-top-section .content {
+ display: flex;
+ flex-direction: column;
+}
+
+.icon-dropdown {
+ @include flexCenter;
+ height: 100%;
+ width: $s-16;
+}
+
+.icon-dropdown svg {
+ @extend .button-icon-small;
+ stroke: var(--icon-foreground);
+ transform: rotate(90deg);
+}
+
+.cta-bottom-section {
+ border-block-start: $s-1 solid var(--color-background-quaternary);
+ display: grid;
+ color: var(--color-foreground-secondary);
+ grid-template-columns: 1fr auto;
+ margin-block-start: $s-12;
+ padding-block-start: $s-12;
+}
+.cta-bottom-section .content {
+ @include t.use-typography("body-small");
+ @include buttonStyle;
+ color: var(--color-foreground-secondary);
+ display: inline;
+ text-align: left;
+}
+
+.cta-text,
+.cta-title {
+ text-align: left;
+}
+
+.cta-text {
+ @include t.use-typography("body-small");
+}
+
+.cta-title {
+ @include t.use-typography("body-medium");
+}
+
+.cta-bottom-section .content strong,
+.cta-highlight {
+ @include t.use-typography("body-small");
+ color: var(--color-accent-tertiary);
+}
+
+.cta-link {
+ @include buttonStyle;
+ align-self: end;
+ margin-inline-start: $s-4;
+}
diff --git a/frontend/src/app/main/ui/dashboard/team.cljs b/frontend/src/app/main/ui/dashboard/team.cljs
index 595ec985a6..fd0fa00184 100644
--- a/frontend/src/app/main/ui/dashboard/team.cljs
+++ b/frontend/src/app/main/ui/dashboard/team.cljs
@@ -74,6 +74,7 @@
invitations-section? (= section :dashboard-team-invitations)
webhooks-section? (= section :dashboard-team-webhooks)
permissions (:permissions team)
+ invitations (:invitations team)
on-invite-member
(mf/use-fn
@@ -108,7 +109,7 @@
[:li {:class (when settings-section? (stl/css :active))}
[:a {:on-click on-nav-settings} (tr "labels.settings")]]]]
[:div {:class (stl/css :dashboard-buttons)}
- (if (and (or invitations-section? members-section?) (:is-admin permissions))
+ (if (and (or invitations-section? members-section?) (:is-admin permissions) (not-empty invitations))
[:a
{:class (stl/css :btn-secondary :btn-small)
:on-click on-invite-member
@@ -735,12 +736,27 @@
(mf/defc empty-invitation-table*
{::mf/props :obj
::mf/private true}
- [{:keys [can-invite]}]
- [:div {:class (stl/css :empty-invitations)}
- [:span (tr "labels.no-invitations")]
- (when ^boolean can-invite
- [:> i18n/tr-html* {:content (tr "labels.no-invitations-hint")
- :tag-name "span"}])])
+ [{:keys [can-invite team]}]
+ (let
+ [route (mf/deref refs/route)
+ invite-email (-> route :query-params :invite-email)
+ on-invite-member (mf/use-fn
+ (mf/deps team invite-email)
+ (fn []
+ (st/emit! (modal/show {:type :invite-members
+ :team team
+ :origin :team
+ :invite-email invite-email}))))]
+ [:div {:class (stl/css :empty-invitations)}
+ [:span (tr "labels.no-invitations")]
+ (when ^boolean can-invite
+ [[:span (tr "labels.no-invitations-gather-people")]
+ [:a
+ {:class (stl/css :btn-empty-invitations)
+ :on-click on-invite-member
+ :data-testid "invite-member"}
+ (tr "dashboard.invite-profile")]
+ [:div {:class (stl/css :blank-space)}]])]))
(mf/defc invitation-section*
{::mf/props :obj
@@ -761,7 +777,7 @@
[:div {:class (stl/css :title-field-role)} (tr "labels.role")]
[:div {:class (stl/css :title-field-status)} (tr "labels.status")]]
(if (empty? invitations)
- [:> empty-invitation-table* {:can-invite can-invite?}]
+ [:> empty-invitation-table* {:can-invite can-invite? :team team}]
[:div {:class (stl/css :table-rows)}
(for [invitation invitations]
[:> invitation-row*
@@ -881,9 +897,10 @@
[:div {:class (stl/css :modal-container)}
[:& fm/form {:form form :on-submit on-submit}
[:div {:class (stl/css :modal-header)}
- (if webhook
- [:h2 {:class (stl/css :modal-title)} (tr "modals.edit-webhook.title")]
- [:h2 {:class (stl/css :modal-title)} (tr "modals.create-webhook.title")])
+ [:h2 {:class (stl/css :modal-title)}
+ (if webhook
+ (tr "modals.edit-webhook.title")
+ (tr "modals.create-webhook.title"))]
[:button {:class (stl/css :modal-close-btn)
:on-click on-modal-close} i/close]]
@@ -1100,10 +1117,6 @@
[:& header {:section :dashboard-team-settings :team team}]
[:section {:class (stl/css :dashboard-team-settings)}
[:div {:class (stl/css :block :info-block)}
- [:div {:class (stl/css :block-label)}
- (tr "dashboard.team-info")]
- [:div {:class (stl/css :block-text)}
- (:name team)]
[:div {:class (stl/css :team-icon)}
(when can-edit
[:button {:class (stl/css :update-overlay)
@@ -1115,7 +1128,11 @@
[:& file-uploader {:accept "image/jpeg,image/png"
:multi false
:ref finput
- :on-selected on-file-selected}])]]
+ :on-selected on-file-selected}])]
+ [:div {:class (stl/css :block-label)}
+ (tr "dashboard.team-info")]
+ [:div {:class (stl/css :block-text)}
+ (:name team)]]
[:div {:class (stl/css :block)}
[:div {:class (stl/css :block-label)}
diff --git a/frontend/src/app/main/ui/dashboard/team.scss b/frontend/src/app/main/ui/dashboard/team.scss
index d6436705fe..cdb45f06a5 100644
--- a/frontend/src/app/main/ui/dashboard/team.scss
+++ b/frontend/src/app/main/ui/dashboard/team.scss
@@ -27,8 +27,7 @@
}
.info-block {
- position: relative;
- padding-top: $s-180;
+ margin-block-start: $s-16;
}
.block-label {
@@ -63,12 +62,11 @@
.team-icon {
--update-button-opacity: 0;
- position: absolute;
- top: 0;
- left: 0;
+ position: relative;
height: $s-120;
width: $s-120;
padding: $s-16;
+ margin-block-end: $s-32;
&:hover {
--update-button-opacity: 1;
@@ -76,6 +74,9 @@
}
.team-image {
+ position: absolute;
+ top: 0;
+ left: 0;
border-radius: 50%;
width: $s-120;
height: $s-120;
@@ -86,8 +87,8 @@
@include buttonStyle;
@include flexCenter;
position: absolute;
- top: $s-16;
- left: $s-16;
+ top: 0;
+ left: 0;
height: 100%;
width: 100%;
z-index: $z-index-modal;
@@ -310,6 +311,12 @@
color: var(--dashboard-list-text-foreground-color);
}
+.btn-empty-invitations {
+ @extend .button-primary;
+ margin-block-start: $s-16;
+ padding-inline: $s-12;
+}
+
.title-field-status {
position: relative;
cursor: default;
diff --git a/frontend/src/app/main/ui/delete_shared.cljs b/frontend/src/app/main/ui/delete_shared.cljs
index ec21009371..92fc47fad9 100644
--- a/frontend/src/app/main/ui/delete_shared.cljs
+++ b/frontend/src/app/main/ui/delete_shared.cljs
@@ -11,6 +11,7 @@
[app.main.data.modal :as modal]
[app.main.repo :as rp]
[app.main.store :as st]
+ [app.main.ui.ds.notifications.context-notification :refer [context-notification*]]
[app.main.ui.icons :as i]
[app.util.dom :as dom]
[app.util.i18n :as i18n :refer [tr]]
@@ -114,7 +115,9 @@
:key (dm/str file-id)}
[:span "- " file-name]])]]
(when (and (string? hint) (not= hint ""))
- [:h3 {:class (stl/css :modal-hint)} hint])]
+ [:> context-notification* {:level :info
+ :appearance :ghost}
+ hint])]
[:*
[:h3 {:class (stl/css :modal-msg)} no-files-msg]]))]
diff --git a/frontend/src/app/main/ui/delete_shared.scss b/frontend/src/app/main/ui/delete_shared.scss
index dfd7741f33..c0ee957e6a 100644
--- a/frontend/src/app/main/ui/delete_shared.scss
+++ b/frontend/src/app/main/ui/delete_shared.scss
@@ -35,10 +35,6 @@
margin-bottom: $s-24;
}
-.modal-hint {
- @extend .modal-hint-base;
-}
-
.element-list {
@include bodyLargeTypography;
color: var(--modal-text-foreground-color);
diff --git a/frontend/src/app/main/ui/ds/controls/combobox.cljs b/frontend/src/app/main/ui/ds/controls/combobox.cljs
index 04a16ace07..fdfedad0a7 100644
--- a/frontend/src/app/main/ui/ds/controls/combobox.cljs
+++ b/frontend/src/app/main/ui/ds/controls/combobox.cljs
@@ -75,6 +75,7 @@
(let [open* (mf/use-state false)
open (deref open*)
+ ;;use-memo-equal
selected* (mf/use-state default-selected)
selected (deref selected*)
@@ -215,6 +216,11 @@
(mf/with-effect [options]
(mf/set-ref-val! options-ref options))
+ (mf/use-effect
+ (mf/deps default-selected)
+ (fn []
+ (reset! selected* default-selected)))
+
[:div {:ref combobox-ref
:class (stl/css-case
:combobox-wrapper true
diff --git a/frontend/src/app/main/ui/ds/controls/input_with_values.cljs b/frontend/src/app/main/ui/ds/controls/input_with_values.cljs
index 4f62df9cfb..c590655df1 100644
--- a/frontend/src/app/main/ui/ds/controls/input_with_values.cljs
+++ b/frontend/src/app/main/ui/ds/controls/input_with_values.cljs
@@ -16,25 +16,28 @@
(def ^:private schema:input-with-values
[:map
[:name :string]
- [:values :string]
+ [:values {:optional true} :string]
[:on-blur {:optional true} fn?]])
-
(mf/defc input-with-values*
{::mf/props :obj
::mf/schema schema:input-with-values}
[{:keys [name values on-blur] :rest props}]
(let [editing* (mf/use-state false)
editing? (deref editing*)
+
input-ref (mf/use-ref)
input (mf/ref-val input-ref)
- title (str name ": " values)
+
+ title (if values (str name ": " values) name)
+
on-edit
(mf/use-fn
(fn [event]
(dom/stop-propagation event)
(reset! editing* true)
(dom/focus! input)))
+
on-stop-edit
(mf/use-fn
(mf/deps on-blur)
@@ -43,6 +46,7 @@
(reset! editing* false)
(when on-blur
(on-blur event))))
+
on-focus
(mf/use-fn
(fn [event]
@@ -70,6 +74,8 @@
[:div {:class (stl/css :input-with-values-edit-container)}
[:> input* props]]
[:div {:class (stl/css :input-with-values-container :input-with-values-grid)
- :title title :on-click on-edit}
- [:span {:class (stl/css :input-with-values-name)} name]
- [:span {:class (stl/css :input-with-values-values)} values]])))
+ :title title
+ :on-click on-edit}
+ [:span {:class (stl/css :input-with-values-name)} name]
+ (when values
+ [:span {:class (stl/css :input-with-values-values)} values])])))
diff --git a/frontend/src/app/main/ui/ds/controls/input_with_values.mdx b/frontend/src/app/main/ui/ds/controls/input_with_values.mdx
index 2c6261be09..778f6bea15 100644
--- a/frontend/src/app/main/ui/ds/controls/input_with_values.mdx
+++ b/frontend/src/app/main/ui/ds/controls/input_with_values.mdx
@@ -5,15 +5,15 @@ import * as InputWithValuesStories from "./input_with_values.stories";
# InputWithValues
-The `input-with-values*` acts as an input with an addition of a series of values that are only indicators.
+The `input-with-values*` acts as an input with an optional addition of a series of values that are only indicators, and an event which is triggered when the focus is lost.
]
+ [leaves paragraph]
+ (let [leaves (filter #(not (str/blank? (:text %))) leaves)
+ num-leaves (count leaves)
+ paragraph-attr-size 48
+ leaf-attr-size 52
+ metadata-size (+ 1 paragraph-attr-size (* num-leaves leaf-attr-size))
+ text (apply str (map :text leaves))
+ text-buffer (utf8->buffer text)
+ text-size (.-byteLength text-buffer)
+ buffer (js/ArrayBuffer. (+ metadata-size text-size))
+ dview (js/DataView. buffer)]
+
+ (.setUint32 dview 0 num-leaves)
+
+ ;; Serialize paragraph attributes
+ (let [text-align (sr/serialize-text-align (:text-align paragraph))
+ text-direction (sr/serialize-text-direction (:text-direction paragraph))
+ text-decoration (sr/serialize-text-decoration (:text-decoration paragraph))
+ text-transform (sr/serialize-text-transform (:text-transform paragraph))
+ line-height (:line-height paragraph)
+ letter-spacing (:letter-spacing paragraph)
+ typography-ref-file (sr/serialize-uuid (:typography-ref-file paragraph))
+ typography-ref-id (sr/serialize-uuid (:typography-ref-id paragraph))]
+
+ (.setUint8 dview 4 text-align)
+ (.setUint8 dview 5 text-direction)
+ (.setUint8 dview 6 text-decoration)
+ (.setUint8 dview 7 text-transform)
+
+ (.setFloat32 dview 8 line-height)
+ (.setFloat32 dview 12 letter-spacing)
+
+ (.setUint32 dview 16 (aget typography-ref-file 0))
+ (.setUint32 dview 20 (aget typography-ref-file 1))
+ (.setUint32 dview 24 (aget typography-ref-file 2))
+ (.setInt32 dview 28 (aget typography-ref-file 3))
+
+ (.setUint32 dview 32 (aget typography-ref-id 0))
+ (.setUint32 dview 36 (aget typography-ref-id 1))
+ (.setUint32 dview 40 (aget typography-ref-id 2))
+ (.setInt32 dview 44 (aget typography-ref-id 3)))
+
+ ;; Serialize leaves attributes
+ (loop [index 0 offset (+ 1 paragraph-attr-size)]
+ (when (< index num-leaves)
+ (let [leaf (nth leaves index)
+ font-style (f/serialize-font-style (:font-style leaf))
+ font-size (:font-size leaf)
+ font-weight (:font-weight leaf)
+ font-id (f/serialize-font-id (:font-id leaf))
+ font-family (hash (:font-family leaf))
+ font-variant-id (sr/serialize-uuid (:font-variant-id leaf))
+ text-buffer (utf8->buffer (:text leaf))
+ text-length (.-byteLength text-buffer)]
+
+ (.setUint8 dview offset font-style)
+ (.setFloat32 dview (+ offset 4) font-size)
+ (.setUint32 dview (+ offset 8) font-weight)
+ (.setUint32 dview (+ offset 12) (aget font-id 0))
+ (.setUint32 dview (+ offset 16) (aget font-id 1))
+ (.setUint32 dview (+ offset 20) (aget font-id 2))
+ (.setInt32 dview (+ offset 24) (aget font-id 3))
+
+ (.setInt32 dview (+ offset 28) font-family)
+
+ (.setUint32 dview (+ offset 32) (aget font-variant-id 0))
+ (.setUint32 dview (+ offset 36) (aget font-variant-id 1))
+ (.setUint32 dview (+ offset 40) (aget font-variant-id 2))
+ (.setInt32 dview (+ offset 44) (aget font-variant-id 3))
+
+ (.setInt32 dview (+ offset 48) text-length)
+
+ (recur (inc index) (+ offset leaf-attr-size)))))
+
+ ;; Add text content to buffer
+ (let [text-offset metadata-size
+ buffer-u8 (js/Uint8Array. buffer)]
+ (.set buffer-u8 (js/Uint8Array. text-buffer) text-offset))
+
+ ;; Allocate memory and set buffer
+ (let [total-size (.-byteLength buffer)
+ metadata-offset (mem/alloc-bytes total-size)
+ heap (mem/get-heap-u8)]
+ (.set heap (js/Uint8Array. buffer) metadata-offset)))
+
+ (h/call wasm/internal-module "_set_shape_text_content"))
diff --git a/frontend/src/app/render_wasm/deserializers.cljs b/frontend/src/app/render_wasm/deserializers.cljs
new file mode 100644
index 0000000000..3c7f1f16c0
--- /dev/null
+++ b/frontend/src/app/render_wasm/deserializers.cljs
@@ -0,0 +1,29 @@
+;; 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.render-wasm.deserializers
+ (:require
+ [app.common.geom.matrix :as gmt]
+ [app.common.uuid :as uuid]))
+
+(defn heap32->entry
+ [heapu32 heapf32 offset]
+ (let [id1 (aget heapu32 (+ offset 0))
+ id2 (aget heapu32 (+ offset 1))
+ id3 (aget heapu32 (+ offset 2))
+ id4 (aget heapu32 (+ offset 3))
+
+ a (aget heapf32 (+ offset 4))
+ b (aget heapf32 (+ offset 5))
+ c (aget heapf32 (+ offset 6))
+ d (aget heapf32 (+ offset 7))
+ e (aget heapf32 (+ offset 8))
+ f (aget heapf32 (+ offset 9))
+
+ id (uuid/from-unsigned-parts id1 id2 id3 id4)]
+
+ {:id id
+ :transform (gmt/matrix a b c d e f)}))
+
diff --git a/frontend/src/app/render_wasm/mem.cljs b/frontend/src/app/render_wasm/mem.cljs
new file mode 100644
index 0000000000..4e5e2bad1b
--- /dev/null
+++ b/frontend/src/app/render_wasm/mem.cljs
@@ -0,0 +1,56 @@
+;; 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.render-wasm.mem
+ (:require
+ [app.render-wasm.helpers :as h]
+ [app.render-wasm.wasm :as wasm]))
+
+(defn ptr8->ptr32
+ "Returns a 32-bit (4-byte aligned) pointer of an 8-bit pointer"
+ [value]
+ ;; Divides the value by 4
+ (bit-shift-right value 2))
+
+(defn ptr32->ptr8
+ "Returns a 8-bit pointer of a 32-bit (4-byte aligned) pointer"
+ [value]
+ ;; Multiplies by 4
+ (bit-shift-left value 2))
+
+(defn get-list-size
+ "Returns the size of a list in bytes"
+ [list list-item-size]
+ (* list-item-size (count list)))
+
+(defn alloc-bytes
+ "Allocates an arbitrary amount of bytes"
+ [size]
+ (when (= size 0)
+ (js/console.trace "Tried to allocate 0 bytes"))
+ (h/call wasm/internal-module "_alloc_bytes" size))
+
+(defn alloc-bytes-32
+ "Allocates a 4-byte aligned amount of bytes"
+ [size]
+ (when (= size 0)
+ (js/console.trace "Tried to allocate 0 bytes"))
+ (ptr8->ptr32 (h/call wasm/internal-module "_alloc_bytes" size)))
+
+(defn get-heap-u8
+ "Returns a Uint8Array view of the heap"
+ []
+ (unchecked-get ^js wasm/internal-module "HEAPU8"))
+
+(defn get-heap-u32
+ "Returns a Uint32Array view of the heap"
+ []
+ (unchecked-get ^js wasm/internal-module "HEAPU32"))
+
+(defn get-heap-f32
+ "Returns a Float32Array view of the heap"
+ []
+ (unchecked-get ^js wasm/internal-module "HEAPF32"))
diff --git a/frontend/src/app/render_wasm/performance.cljc b/frontend/src/app/render_wasm/performance.cljc
new file mode 100644
index 0000000000..95c39c4468
--- /dev/null
+++ b/frontend/src/app/render_wasm/performance.cljc
@@ -0,0 +1,41 @@
+;; 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.render-wasm.performance
+ #?(:cljs (:require-macros [app.render-wasm.performance]))
+ (:require
+ [cuerdas.core :as str]))
+
+(defn enabled?
+ []
+ #?(:clj (= (System/getProperty "penpot.wasm.profile-marks") "true")
+ :cljs false))
+
+(defmacro begin-measure
+ [measure-name]
+ (when enabled?
+ (let [measure-name (str/concat measure-name "::begin")]
+ `(.mark js/performance ~measure-name))))
+
+(defmacro end-measure
+ [measure-name & [detail]]
+ (when enabled?
+ (let [begin-name (str/concat measure-name "::begin")
+ end-name (str/concat measure-name "::end")
+ detail `(cljs.core/js-obj ~@(mapcat (fn [[k v]] [(name k) v]) detail))
+ options `(cljs.core/js-obj "start" ~begin-name "end" ~end-name "detail" ~detail)]
+ `(do (.mark js/performance ~end-name)
+ (.measure js/performance ~measure-name ~options)))))
+
+(defmacro with-measure
+ "Measures the time of a function call. This should only be called in synchronous functions"
+ [[measure-name detail] body]
+ (if-not enabled?
+ body
+ `(let [_# (begin-measure ~measure-name)
+ result# ~body
+ _# (end-measure ~measure-name ~detail)]
+ result#)))
diff --git a/frontend/src/app/render_wasm/serializers.cljs b/frontend/src/app/render_wasm/serializers.cljs
new file mode 100644
index 0000000000..ecd881444f
--- /dev/null
+++ b/frontend/src/app/render_wasm/serializers.cljs
@@ -0,0 +1,300 @@
+;; 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.render-wasm.serializers
+ (:require
+ [app.common.data.macros :as dm]
+ [app.common.uuid :as uuid]
+ [cuerdas.core :as str]))
+
+(defn u8
+ [value]
+ (let [u8-arr (js/Uint8Array. 1)]
+ (aset u8-arr 0 value)
+ u8-arr))
+
+(defn f32->u8
+ [value]
+ (let [f32-arr (js/Float32Array. 1)]
+ (aset f32-arr 0 value)
+ (js/Uint8Array. (.-buffer f32-arr))))
+
+(defn i32->u8
+ [value]
+ (let [i32-arr (js/Int32Array. 1)]
+ (aset i32-arr 0 value)
+ (js/Uint8Array. (.-buffer i32-arr))))
+
+(defn bool->u8
+ [value]
+ (let [result (js/Uint8Array. 1)]
+ (aset result 0 (if value 1 0))
+ result))
+
+(defn uuid->u8
+ [id]
+ (let [buffer (uuid/get-u32 id)
+ u32-arr (js/Uint32Array. 4)]
+ (aset u32-arr 0 (aget buffer 0))
+ (aset u32-arr 1 (aget buffer 1))
+ (aset u32-arr 2 (aget buffer 2))
+ (aset u32-arr 3 (aget buffer 3))
+ (js/Uint8Array. (.-buffer u32-arr))))
+
+(defn serialize-uuid
+ [id]
+ (if (nil? id)
+ [uuid/zero]
+ (let [as-uuid (uuid/uuid id)]
+ (uuid/get-u32 as-uuid))))
+
+(defn heapu32-set-u32
+ [value heap offset]
+ (aset heap offset value))
+
+(defn heapu32-set-uuid
+ [id heap offset]
+ (let [buffer (uuid/get-u32 id)]
+ (.set heap buffer offset)
+ buffer))
+
+(defn heapf32-set-matrix
+ [matrix heap offset]
+ (let [a (dm/get-prop matrix :a)
+ b (dm/get-prop matrix :b)
+ c (dm/get-prop matrix :c)
+ d (dm/get-prop matrix :d)
+ e (dm/get-prop matrix :e)
+ f (dm/get-prop matrix :f)]
+ (aset heap (+ offset 0) a)
+ (aset heap (+ offset 1) b)
+ (aset heap (+ offset 2) c)
+ (aset heap (+ offset 3) d)
+ (aset heap (+ offset 4) e)
+ (aset heap (+ offset 5) f)))
+
+(defn translate-shape-type
+ [type]
+ (case type
+ :frame 0
+ :group 1
+ :bool 2
+ :rect 3
+ :path 4
+ :text 5
+ :circle 6
+ :svg-raw 7
+ :image 8))
+
+(defn translate-stroke-style
+ [stroke-style]
+ (case stroke-style
+ :dotted 1
+ :dashed 2
+ :mixed 3
+ 0))
+
+(defn translate-stroke-cap
+ [stroke-cap]
+ (case stroke-cap
+ :line-arrow 1
+ :triangle-arrow 2
+ :square-marker 3
+ :circle-marker 4
+ :diamond-marker 5
+ :round 6
+ :square 7
+ 0))
+
+
+(defn serialize-path-attrs
+ [svg-attrs]
+ (reduce
+ (fn [acc [key value]]
+ (str/concat
+ acc
+ (str/kebab key) "\0"
+ value "\0")) "" svg-attrs))
+
+(defn translate-blend-mode
+ [blend-mode]
+ (case blend-mode
+ :normal 3
+ :darken 16
+ :multiply 24
+ :color-burn 19
+ :lighten 17
+ :screen 14
+ :color-dodge 18
+ :overlay 15
+ :soft-light 21
+ :hard-light 20
+ :difference 22
+ :exclusion 23
+ :hue 25
+ :saturation 26
+ :color 27
+ :luminosity 28
+ 3))
+
+(defn translate-constraint-h
+ [type]
+ (case type
+ :left 0
+ :right 1
+ :leftright 2
+ :center 3
+ :scale 4))
+
+(defn translate-constraint-v
+ [type]
+ (case type
+ :top 0
+ :bottom 1
+ :topbottom 2
+ :center 3
+ :scale 4))
+
+(defn translate-bool-type
+ [bool-type]
+ (case bool-type
+ :union 0
+ :difference 1
+ :intersection 2
+ :exclusion 3
+ 0))
+
+(defn translate-blur-type
+ [blur-type]
+ (case blur-type
+ :layer-blur 1
+ 0))
+
+(defn translate-layout-flex-dir
+ [flex-dir]
+ (case flex-dir
+ :row 0
+ :row-reverse 1
+ :column 2
+ :column-reverse 3))
+
+(defn translate-layout-grid-dir
+ [flex-dir]
+ (case flex-dir
+ :row 0
+ :column 1))
+
+(defn translate-layout-align-items
+ [align-items]
+ (case align-items
+ :start 0
+ :end 1
+ :center 2
+ :stretch 3))
+
+(defn translate-layout-align-content
+ [align-content]
+ (case align-content
+ :start 0
+ :end 1
+ :center 2
+ :space-between 3
+ :space-around 4
+ :space-evenly 5
+ :stretch 6))
+
+(defn translate-layout-justify-items
+ [justify-items]
+ (case justify-items
+ :start 0
+ :end 1
+ :center 2
+ :stretch 3))
+
+(defn translate-layout-justify-content
+ [justify-content]
+ (case justify-content
+ :start 0
+ :end 1
+ :center 2
+ :space-between 3
+ :space-around 4
+ :space-evenly 5
+ :stretch 6))
+
+(defn translate-layout-wrap-type
+ [wrap-type]
+ (case wrap-type
+ :wrap 0
+ :nowrap 1))
+
+(defn translate-grid-track-type
+ [type]
+ (case type
+ :percent 0
+ :flex 1
+ :auto 2
+ :fixed 3))
+
+(defn translate-layout-sizing
+ [value]
+ (case value
+ :fill 0
+ :fix 1
+ :auto 2))
+
+(defn translate-align-self
+ [value]
+ (when value
+ (case value
+ :auto 0
+ :start 1
+ :end 2
+ :center 3
+ :stretch 4)))
+
+(defn translate-justify-self
+ [value]
+ (when value
+ (case value
+ :auto 0
+ :start 1
+ :end 2
+ :center 3
+ :stretch 4)))
+
+(defn translate-shadow-style
+ [style]
+ (case style
+ :drop-shadow 0
+ :inner-shadow 1
+ 0))
+
+(defn translate-structure-modifier-type
+ [type]
+ (case type
+ :remove-children 1
+ :add-children 2))
+
+(defn- serialize-enum
+ [value enum-map]
+ (get enum-map value 0))
+
+(defn serialize-text-align
+ [text-align]
+ (serialize-enum text-align {"left" 0 "center" 1 "right" 2 "justify" 3}))
+
+(defn serialize-text-transform
+ [text-transform]
+ (serialize-enum text-transform {"none" 0 "uppercase" 1 "lowercase" 2 "capitalize" 3}))
+
+(defn serialize-text-decoration
+ [text-decoration]
+ (serialize-enum text-decoration {"none" 0 "underline" 1 "line-through" 2 "overline" 3}))
+
+(defn serialize-text-direction
+ [text-direction]
+ (serialize-enum text-direction {"ltr" 0 "rtl" 1}))
diff --git a/frontend/src/app/render_wasm/serializers/color.cljs b/frontend/src/app/render_wasm/serializers/color.cljs
new file mode 100644
index 0000000000..35fda2b756
--- /dev/null
+++ b/frontend/src/app/render_wasm/serializers/color.cljs
@@ -0,0 +1,11 @@
+(ns app.render-wasm.serializers.color
+ (:require
+ [app.common.math :as mth]))
+
+(defn hex->u32argb
+ "Takes a hex color in #rrggbb format, and an opacity value from 0 to 1 and returns its 32-bit argb representation"
+ [hex opacity]
+ (let [rgb (js/parseInt (subs hex 1) 16)
+ a (mth/floor (* (or opacity 1) 0xff))]
+ ;; rgba >>> 0 so we have an unsigned representation
+ (unsigned-bit-shift-right (bit-or (bit-shift-left a 24) rgb) 0)))
\ No newline at end of file
diff --git a/frontend/src/app/render_wasm/serializers/fills.cljs b/frontend/src/app/render_wasm/serializers/fills.cljs
new file mode 100644
index 0000000000..f4f395b66e
--- /dev/null
+++ b/frontend/src/app/render_wasm/serializers/fills.cljs
@@ -0,0 +1,39 @@
+(ns app.render-wasm.serializers.fills
+ (:require
+ [app.render-wasm.serializers.color :as clr]))
+
+(def ^:private GRADIENT-STOP-SIZE 8)
+(def ^:private GRADIENT-BASE-SIZE 28)
+;; TODO: Define in shape model
+(def ^:private MAX-GRADIENT-STOPS 16)
+
+(def GRADIENT-BYTE-SIZE
+ (+ GRADIENT-BASE-SIZE (* MAX-GRADIENT-STOPS GRADIENT-STOP-SIZE)))
+
+(defn write-gradient-fill!
+ [offset heap gradient opacity]
+ (let [dview (js/DataView. (.-buffer heap))
+ start-x (:start-x gradient)
+ start-y (:start-y gradient)
+ end-x (:end-x gradient)
+ end-y (:end-y gradient)
+ width (or (:width gradient) 0)
+ stops (take MAX-GRADIENT-STOPS (:stops gradient))]
+ (.setFloat32 dview offset start-x true)
+ (.setFloat32 dview (+ offset 4) start-y true)
+ (.setFloat32 dview (+ offset 8) end-x true)
+ (.setFloat32 dview (+ offset 12) end-y true)
+ (.setFloat32 dview (+ offset 16) opacity true)
+ (.setFloat32 dview (+ offset 20) width true)
+ (.setUint32 dview (+ offset 24) (count stops) true)
+ (loop [stops (seq stops) offset (+ offset GRADIENT-BASE-SIZE)]
+ (if (empty? stops)
+ offset
+ (let [stop (first stops)
+ hex-color (:color stop)
+ opacity (:opacity stop)
+ argb (clr/hex->u32argb hex-color opacity)
+ stop-offset (:offset stop)]
+ (.setUint32 dview offset argb true)
+ (.setFloat32 dview (+ offset 4) stop-offset true)
+ (recur (rest stops) (+ offset GRADIENT-STOP-SIZE)))))))
\ No newline at end of file
diff --git a/frontend/src/app/render_wasm/shape.cljs b/frontend/src/app/render_wasm/shape.cljs
index d38bdd1aa7..6f80a65982 100644
--- a/frontend/src/app/render_wasm/shape.cljs
+++ b/frontend/src/app/render_wasm/shape.cljs
@@ -8,7 +8,9 @@
(:require
[app.common.transit :as t]
[app.common.types.shape :as shape]
+ [app.common.types.shape.layout :as ctl]
[app.render-wasm.api :as api]
+ [beicon.v2.core :as rx]
[clojure.core :as c]
[cuerdas.core :as str]))
@@ -106,51 +108,135 @@
;; --- SHAPE IMPL
-(defn- set-wasm-attrs
- [self k v]
- (when ^boolean shape/*wasm-sync*
- (api/use-shape (:id self))
+(defn set-wasm-single-attr!
+ [shape k]
+ (let [v (get shape k)]
(case k
:parent-id (api/set-parent-id v)
:type (api/set-shape-type v)
:bool-type (api/set-shape-bool-type v)
- :bool-content (api/set-shape-bool-content v)
:selrect (api/set-shape-selrect v)
- :show-content (if (= (:type self) :frame)
+ :show-content (if (= (:type shape) :frame)
(api/set-shape-clip-content (not v))
(api/set-shape-clip-content false))
:rotation (api/set-shape-rotation v)
:transform (api/set-shape-transform v)
- :fills (api/set-shape-fills v)
- :strokes (api/set-shape-strokes v)
+ :fills (into [] (api/set-shape-fills v))
+ :strokes (into [] (api/set-shape-strokes v))
:blend-mode (api/set-shape-blend-mode v)
:opacity (api/set-shape-opacity v)
:hidden (api/set-shape-hidden v)
:shapes (api/set-shape-children v)
:blur (api/set-shape-blur v)
+ :shadow (api/set-shape-shadows v)
:constraints-h (api/set-constraints-h v)
:constraints-v (api/set-constraints-v v)
- :svg-attrs (when (= (:type self) :path)
- (api/set-shape-path-attrs v))
- :masked-group (when (and (= (:type self) :group) (:masked-group self))
- (api/set-masked (:masked-group self)))
- :content (cond
- (= (:type self) :path)
- (api/set-shape-path-content v)
+ :svg-attrs
+ (when (= (:type shape) :path)
+ (api/set-shape-path-attrs v))
- (= (:type self) :svg-raw)
- (api/set-shape-svg-raw-content (api/get-static-markup self)))
- nil)
- ;; when something synced with wasm
- ;; is modified, we need to request
- ;; a new render.
- (api/clear-cache)
- (api/request-render "set-wasm-attrs")))
+ :masked-group
+ (when (and (= (:type shape) :group) (:masked-group shape))
+ (api/set-masked (:masked-group shape)))
+
+ :content
+ (cond
+ (or (= (:type shape) :path)
+ (= (:type shape) :bool))
+ (api/set-shape-path-content v)
+
+ (= (:type shape) :svg-raw)
+ (api/set-shape-svg-raw-content (api/get-static-markup shape))
+
+ (= (:type shape) :text)
+ (into [] (api/set-shape-text-content v)))
+
+ (:layout-item-margin
+ :layout-item-margin-type
+ :layout-item-h-sizing
+ :layout-item-v-sizing
+ :layout-item-max-h
+ :layout-item-min-h
+ :layout-item-max-w
+ :layout-item-min-w
+ :layout-item-absolute
+ :layout-item-z-index)
+ (api/set-layout-child shape)
+
+ :layout-grid-rows
+ (api/set-grid-layout-rows v)
+
+ :layout-grid-columns
+ (api/set-grid-layout-columns v)
+
+ :layout-grid-cells
+ (api/set-grid-layout-cells v)
+
+ (:layout
+ :layout-flex-dir
+ :layout-gap-type
+ :layout-gap
+ :layout-align-items
+ :layout-align-content
+ :layout-justify-items
+ :layout-justify-content
+ :layout-wrap-type
+ :layout-padding-type
+ :layout-padding)
+ (cond
+ (ctl/grid-layout? shape)
+ (api/set-grid-layout-data shape)
+
+ (ctl/flex-layout? shape)
+ (api/set-flex-layout shape))
+
+ nil)))
+
+(defn set-wasm-multi-attrs!
+ [shape properties]
+ (api/use-shape (:id shape))
+ (let [pending
+ (->> properties
+ (mapcat #(set-wasm-single-attr! shape %)))]
+ (if (and pending (seq pending))
+ (->> (rx/from pending)
+ (rx/mapcat identity)
+ (rx/reduce conj [])
+ (rx/subs!
+ (fn [_]
+ (api/update-shape-tiles)
+ (api/clear-drawing-cache)
+ (api/request-render "set-wasm-attrs-pending"))))
+ (do
+ (api/update-shape-tiles)
+ (api/request-render "set-wasm-attrs")))))
+
+(defn set-wasm-attrs!
+ [shape k v]
+ (let [shape (assoc shape k v)]
+ (api/use-shape (:id shape))
+ (let [pending (set-wasm-single-attr! shape k)]
+ ;; TODO: set-wasm-attrs is called twice with every set
+ (if (and pending (seq pending))
+ (->> (rx/from pending)
+ (rx/mapcat identity)
+ (rx/reduce conj [])
+ (rx/subs!
+ (fn [_]
+ (api/update-shape-tiles)
+ (api/clear-drawing-cache)
+ (api/request-render "set-wasm-attrs-pending"))))
+ (do
+ (api/update-shape-tiles)
+ (api/request-render "set-wasm-attrs"))))))
(defn- impl-assoc
[self k v]
- (set-wasm-attrs self k v)
+ (when ^boolean shape/*wasm-sync*
+ (binding [shape/*wasm-sync* false]
+ (set-wasm-attrs! self k v)))
+
(case k
:id
(ShapeProxy. v
@@ -171,7 +257,10 @@
(defn- impl-dissoc
[self k]
- (set-wasm-attrs self k nil)
+ (when ^boolean shape/*wasm-sync*
+ (binding [shape/*wasm-sync* false]
+ (set-wasm-attrs! self k nil)))
+
(case k
:id
(ShapeProxy. nil
diff --git a/frontend/src/app/render_wasm/wasm.cljs b/frontend/src/app/render_wasm/wasm.cljs
new file mode 100644
index 0000000000..542d4c49a1
--- /dev/null
+++ b/frontend/src/app/render_wasm/wasm.cljs
@@ -0,0 +1,4 @@
+(ns app.render-wasm.wasm)
+
+(defonce internal-frame-id nil)
+(defonce internal-module #js {})
\ No newline at end of file
diff --git a/frontend/src/app/util/path/tools.cljs b/frontend/src/app/util/path/tools.cljs
index 78d1064004..11975774ab 100644
--- a/frontend/src/app/util/path/tools.cljs
+++ b/frontend/src/app/util/path/tools.cljs
@@ -449,11 +449,13 @@
(defn merge-nodes
"Reduces the contiguous segments in points to a single point"
[content points]
- (let [point->merge-point (-> content
- (get-segments points)
- (group-segments)
- (calculate-merge-points points))]
- (-> content
- (separate-nodes points)
- (replace-points point->merge-point))))
+ (let [segments (get-segments content points)]
+ (if (seq segments)
+ (let [point->merge-point (-> segments
+ (group-segments)
+ (calculate-merge-points points))]
+ (-> content
+ (separate-nodes points)
+ (replace-points point->merge-point)))
+ content)))
diff --git a/frontend/src/app/util/time.cljs b/frontend/src/app/util/time.cljs
index 760b32704c..a68e3d2037 100644
--- a/frontend/src/app/util/time.cljs
+++ b/frontend/src/app/util/time.cljs
@@ -277,6 +277,14 @@
(->> #js {:locale locale}
(dfn-format v f))))))
+(defn format-date-locale-short
+ ([v] (format-date-locale-short v nil))
+ ([v {:keys [locale] :or {locale "en"}}]
+ (when v
+ (let [locale-obj (obj/get locales locale)
+ format-str "MMMM do, yyyy"]
+ (dfn-format (js/Date. v) format-str #js {:locale locale-obj})))))
+
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Measurement Helpers
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
diff --git a/frontend/src/app/worker/export.cljs b/frontend/src/app/worker/export.cljs
index de0cc6b50a..7c4a9969dd 100644
--- a/frontend/src/app/worker/export.cljs
+++ b/frontend/src/app/worker/export.cljs
@@ -421,11 +421,9 @@
:uri uri}))
(rx/catch
(fn [cause]
- (rx/of (ex/raise :type :internal
- :code :export-error
- :hint "unexpected error on exporting file"
- :file-id (:id file)
- :cause cause))))))))
+ (rx/of {:type :error
+ :file-id (:id file)
+ :hint (ex-message cause)})))))))
(= format :legacy-zip)
(->> (rx/from files)
diff --git a/frontend/src/features.cljs b/frontend/src/features.cljs
index 9c30a86244..7f6c9a384d 100644
--- a/frontend/src/features.cljs
+++ b/frontend/src/features.cljs
@@ -12,9 +12,6 @@
[app.plugins :as plugins]
[app.util.timers :as tm]))
-(defn ^:export is-components-v2 []
- (features/active-feature? @st/state "components/v2"))
-
(defn ^:export grid []
(tm/schedule-on-idle #(st/emit! (features/toggle-feature "layout/grid")))
nil)
diff --git a/frontend/test/frontend_tests/helpers/pages.cljs b/frontend/test/frontend_tests/helpers/pages.cljs
index 7a4e2e0208..8993326237 100644
--- a/frontend/test/frontend_tests/helpers/pages.cljs
+++ b/frontend/test/frontend_tests/helpers/pages.cljs
@@ -146,8 +146,6 @@
(:objects page)
(:id page)
current-file-id
- true
- dwg/prepare-create-group
cfsh/prepare-create-artboard-from-selection)]
(swap! idmap assoc instance-label (:id group)
diff --git a/frontend/test/frontend_tests/logic/components_and_tokens.cljs b/frontend/test/frontend_tests/logic/components_and_tokens.cljs
index e441f51d8f..2add7ecf4e 100644
--- a/frontend/test/frontend_tests/logic/components_and_tokens.cljs
+++ b/frontend/test/frontend_tests/logic/components_and_tokens.cljs
@@ -15,11 +15,11 @@
[app.common.test-helpers.tokens :as ctht]
[app.common.types.tokens-lib :as ctob]
[app.main.data.helpers :as dsh]
- [app.main.data.tokens :as dt]
[app.main.data.workspace.libraries :as dwl]
[app.main.data.workspace.selection :as dws]
- [app.main.ui.workspace.tokens.changes :as wtch]
- [app.main.ui.workspace.tokens.update :as wtu]
+ [app.main.data.workspace.tokens.application :as dwta]
+ [app.main.data.workspace.tokens.library-edit :as dwtl]
+ [app.main.data.workspace.tokens.propagation :as dwtp]
[cljs.test :as t :include-macros true]
[frontend-tests.helpers.pages :as thp]
[frontend-tests.helpers.state :as ths]
@@ -134,10 +134,10 @@
store (ths/setup-store file)
;; ==== Action
- events [(wtch/apply-token {:shape-ids [(cthi/id :frame1)]
+ events [(dwta/apply-token {:shape-ids [(cthi/id :frame1)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "test-token-2")
- :on-update-shape wtch/update-shape-radius-all})]
+ :on-update-shape dwta/update-shape-radius-all})]
step2 (fn [_]
(let [events2 [(dwl/sync-file (:id file) (:id file))]]
@@ -171,7 +171,7 @@
store (ths/setup-store file)
;; ==== Action
- events [(wtch/unapply-token {:shape-ids [(cthi/id :frame1)]
+ events [(dwta/unapply-token {:shape-ids [(cthi/id :frame1)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "test-token-1")})]
@@ -203,14 +203,14 @@
store (ths/setup-store file)
;; ==== Action
- events [(dt/set-selected-token-set-name "test-token-set")
- (dt/update-token "test-token-1"
- {:name "test-token-1"
- :type :border-radius
- :value 66})]
+ events [(dwtl/set-selected-token-set-name "test-token-set")
+ (dwtl/update-token "test-token-1"
+ {:name "test-token-1"
+ :type :border-radius
+ :value 66})]
step2 (fn [_]
- (let [events2 [(wtu/update-workspace-tokens)
+ (let [events2 [(dwtp/propagate-workspace-tokens)
(dwl/sync-file (:id file) (:id file))]]
(tohs/run-store-async
store done events2
@@ -242,14 +242,14 @@
store (ths/setup-store file)
;; ==== Action
- events [(wtch/apply-token {:shape-ids [(cthi/id :c-frame1)]
+ events [(dwta/apply-token {:shape-ids [(cthi/id :c-frame1)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "test-token-2")
- :on-update-shape wtch/update-shape-radius-all})
- (wtch/apply-token {:shape-ids [(cthi/id :frame1)]
+ :on-update-shape dwta/update-shape-radius-all})
+ (dwta/apply-token {:shape-ids [(cthi/id :frame1)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "test-token-3")
- :on-update-shape wtch/update-shape-radius-all})]
+ :on-update-shape dwta/update-shape-radius-all})]
step2 (fn [_]
(let [events2 [(dwl/sync-file (:id file) (:id file))]]
@@ -283,13 +283,13 @@
store (ths/setup-store file)
;; ==== Action
- events [(wtch/unapply-token {:shape-ids [(cthi/id :c-frame1)]
+ events [(dwta/unapply-token {:shape-ids [(cthi/id :c-frame1)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "test-token-1")})
- (wtch/apply-token {:shape-ids [(cthi/id :frame1)]
+ (dwta/apply-token {:shape-ids [(cthi/id :frame1)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "test-token-3")
- :on-update-shape wtch/update-shape-radius-all})]
+ :on-update-shape dwta/update-shape-radius-all})]
step2 (fn [_]
(let [events2 [(dwl/sync-file (:id file) (:id file))]]
@@ -359,28 +359,28 @@
store (ths/setup-store file)
;; ==== Action
- events [(dt/set-selected-token-set-name "test-token-set")
- (dt/update-token "token-radius"
- {:name "token-radius"
- :value 30})
- (dt/update-token "token-rotation"
- {:name "token-rotation"
- :value 45})
- (dt/update-token "token-opacity"
- {:name "token-opacity"
- :value 0.9})
- (dt/update-token "token-stroke-width"
- {:name "token-stroke-width"
- :value 8})
- (dt/update-token "token-color"
- {:name "token-color"
- :value "#ff0000"})
- (dt/update-token "token-dimensions"
- {:name "token-dimensions"
- :value 200})]
+ events [(dwtl/set-selected-token-set-name "test-token-set")
+ (dwtl/update-token "token-radius"
+ {:name "token-radius"
+ :value 30})
+ (dwtl/update-token "token-rotation"
+ {:name "token-rotation"
+ :value 45})
+ (dwtl/update-token "token-opacity"
+ {:name "token-opacity"
+ :value 0.9})
+ (dwtl/update-token "token-stroke-width"
+ {:name "token-stroke-width"
+ :value 8})
+ (dwtl/update-token "token-color"
+ {:name "token-color"
+ :value "#ff0000"})
+ (dwtl/update-token "token-dimensions"
+ {:name "token-dimensions"
+ :value 200})]
step2 (fn [_]
- (let [events2 [(wtu/update-workspace-tokens)
+ (let [events2 [(dwtp/propagate-workspace-tokens)
(dwl/sync-file (:id file) (:id file))]]
(tohs/run-store-async
store done events2
diff --git a/frontend/test/frontend_tests/runner.cljs b/frontend/test/frontend_tests/runner.cljs
index bca0112e19..9799fb6aa6 100644
--- a/frontend/test/frontend_tests/runner.cljs
+++ b/frontend/test/frontend_tests/runner.cljs
@@ -10,9 +10,9 @@
[frontend-tests.logic.groups-test]
[frontend-tests.plugins.context-shapes-test]
[frontend-tests.tokens.logic.token-actions-test]
+ [frontend-tests.tokens.logic.token-data-test]
[frontend-tests.tokens.style-dictionary-test]
[frontend-tests.tokens.token-form-test]
- [frontend-tests.tokens.token-test]
[frontend-tests.util-range-tree-test]
[frontend-tests.util-simple-math-test]
[frontend-tests.util-snap-data-test]))
@@ -39,6 +39,6 @@
'frontend-tests.util-simple-math-test
'frontend-tests.basic-shapes-test
'frontend-tests.tokens.logic.token-actions-test
+ 'frontend-tests.tokens.logic.token-data-test
'frontend-tests.tokens.style-dictionary-test
- 'frontend-tests.tokens.token-test
'frontend-tests.tokens.token-form-test))
diff --git a/frontend/test/frontend_tests/tokens/helpers/state.cljs b/frontend/test/frontend_tests/tokens/helpers/state.cljs
index 25fa2805ba..c5a7f864dc 100644
--- a/frontend/test/frontend_tests/tokens/helpers/state.cljs
+++ b/frontend/test/frontend_tests/tokens/helpers/state.cljs
@@ -1,8 +1,14 @@
+;; 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 frontend-tests.tokens.helpers.state
(:require
[app.common.types.tokens-lib :as ctob]
[app.main.data.helpers :as dsh]
- [app.main.ui.workspace.tokens.style-dictionary :as sd]
+ [app.main.data.style-dictionary :as sd]
[beicon.v2.core :as rx]
[potok.v2.core :as ptk]))
diff --git a/frontend/test/frontend_tests/tokens/helpers/tokens.cljs b/frontend/test/frontend_tests/tokens/helpers/tokens.cljs
index eb6c4b7cda..d97089a00d 100644
--- a/frontend/test/frontend_tests/tokens/helpers/tokens.cljs
+++ b/frontend/test/frontend_tests/tokens/helpers/tokens.cljs
@@ -1,8 +1,14 @@
+;; 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 frontend-tests.tokens.helpers.tokens
(:require
+ [app.common.files.tokens :as cft]
[app.common.test-helpers.ids-map :as thi]
- [app.common.types.tokens-lib :as ctob]
- [app.main.ui.workspace.tokens.token :as wtt]))
+ [app.common.types.tokens-lib :as ctob]))
(defn get-token [file name]
(some-> (get-in file [:data :tokens-lib])
@@ -14,9 +20,12 @@
(let [first-page-id (get-in file [:data :pages 0])
shape-id (thi/id shape-label)
token (get-token file token-label)
- applied-attributes (wtt/attributes-map attributes token)]
+ applied-attributes (cft/attributes-map attributes token)]
(update-in file [:data
:pages-index first-page-id
:objects shape-id
:applied-tokens]
merge applied-attributes)))
+
+(defn get-tokens-lib [file]
+ (get-in file [:data :tokens-lib]))
\ No newline at end of file
diff --git a/frontend/test/frontend_tests/tokens/logic/token_actions_test.cljs b/frontend/test/frontend_tests/tokens/logic/token_actions_test.cljs
index b58a271048..8bccd46fb2 100644
--- a/frontend/test/frontend_tests/tokens/logic/token_actions_test.cljs
+++ b/frontend/test/frontend_tests/tokens/logic/token_actions_test.cljs
@@ -1,10 +1,16 @@
+;; 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 frontend-tests.tokens.logic.token-actions-test
(:require
[app.common.test-helpers.compositions :as ctho]
[app.common.test-helpers.files :as cthf]
[app.common.test-helpers.shapes :as cths]
[app.common.types.tokens-lib :as ctob]
- [app.main.ui.workspace.tokens.changes :as wtch]
+ [app.main.data.workspace.tokens.application :as dwta]
[cljs.test :as t :include-macros true]
[frontend-tests.helpers.pages :as thp]
[frontend-tests.helpers.state :as ths]
@@ -48,10 +54,10 @@
(let [file (setup-file-with-tokens)
store (ths/setup-store file)
rect-1 (cths/get-shape file :rect-1)
- events [(wtch/apply-token {:shape-ids [(:id rect-1)]
+ events [(dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "borderRadius.md")
- :on-update-shape wtch/update-shape-radius-all})]]
+ :on-update-shape dwta/update-shape-radius-all})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -73,14 +79,14 @@
(let [file (setup-file-with-tokens)
store (ths/setup-store file)
rect-1 (cths/get-shape file :rect-1)
- events [(wtch/apply-token {:shape-ids [(:id rect-1)]
+ events [(dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "borderRadius.sm")
- :on-update-shape wtch/update-shape-radius-all})
- (wtch/apply-token {:shape-ids [(:id rect-1)]
+ :on-update-shape dwta/update-shape-radius-all})
+ (dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "borderRadius.md")
- :on-update-shape wtch/update-shape-radius-all})]]
+ :on-update-shape dwta/update-shape-radius-all})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -101,17 +107,17 @@
store (ths/setup-store file)
rect-1 (cths/get-shape file :rect-1)
events [;; Apply "borderRadius.sm" to all border radius attributes
- (wtch/apply-token {:attributes #{:r1 :r2 :r3 :r4}
+ (dwta/apply-token {:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "borderRadius.sm")
:shape-ids [(:id rect-1)]
- :on-update-shape wtch/update-shape-radius-all})
+ :on-update-shape dwta/update-shape-radius-all})
;; Apply single `:r1` attribute to same shape
;; while removing other attributes from the border-radius set
;; but keep `:r4` for testing purposes
- (wtch/apply-token {:attributes #{:r1 :r2 :r3}
+ (dwta/apply-token {:attributes #{:r1 :r2 :r3}
:token (toht/get-token file "borderRadius.md")
:shape-ids [(:id rect-1)]
- :on-update-shape wtch/update-shape-radius-all})]]
+ :on-update-shape dwta/update-shape-radius-all})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -133,14 +139,14 @@
store (ths/setup-store file)
rect-1 (cths/get-shape file :rect-1)
rect-2 (cths/get-shape file :rect-2)
- events [(wtch/apply-token {:shape-ids [(:id rect-1)]
+ events [(dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:r3 :r4}
:token (toht/get-token file "borderRadius.sm")
- :on-update-shape wtch/update-shape-radius-for-corners})
- (wtch/apply-token {:shape-ids [(:id rect-2)]
+ :on-update-shape dwta/update-shape-radius-for-corners})
+ (dwta/apply-token {:shape-ids [(:id rect-2)]
:attributes #{:r1 :r2 :r3 :r4}
:token (toht/get-token file "borderRadius.sm")
- :on-update-shape wtch/update-shape-radius-all})]]
+ :on-update-shape dwta/update-shape-radius-all})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -185,22 +191,22 @@
store (ths/setup-store file)
rect-1 (cths/get-shape file :rect-1)
rect-2 (cths/get-shape file :rect-2)
- events [(wtch/apply-token {:shape-ids [(:id rect-1)]
+ events [(dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:color}
:token (toht/get-token file "color.primary")
- :on-update-shape wtch/update-fill})
- (wtch/apply-token {:shape-ids [(:id rect-1)]
+ :on-update-shape dwta/update-fill})
+ (dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:stroke-color}
:token (toht/get-token file "color.primary")
- :on-update-shape wtch/update-stroke-color})
- (wtch/apply-token {:shape-ids [(:id rect-2)]
+ :on-update-shape dwta/update-stroke-color})
+ (dwta/apply-token {:shape-ids [(:id rect-2)]
:attributes #{:color}
:token (toht/get-token file "color.secondary")
- :on-update-shape wtch/update-fill})
- (wtch/apply-token {:shape-ids [(:id rect-2)]
+ :on-update-shape dwta/update-fill})
+ (dwta/apply-token {:shape-ids [(:id rect-2)]
:attributes #{:stroke-color}
:token (toht/get-token file "color.secondary")
- :on-update-shape wtch/update-stroke-color})]]
+ :on-update-shape dwta/update-stroke-color})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -239,10 +245,10 @@
#(ctob/add-token-in-set % "Set A" (ctob/make-token dimensions-token))))
store (ths/setup-store file)
rect-1 (cths/get-shape file :rect-1)
- events [(wtch/apply-token {:shape-ids [(:id rect-1)]
+ events [(dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:width :height}
:token (toht/get-token file "dimensions.sm")
- :on-update-shape wtch/update-shape-dimensions})]]
+ :on-update-shape dwta/update-shape-dimensions})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -272,10 +278,10 @@
store (ths/setup-store file)
frame-1 (cths/get-shape file :frame-1)
frame-2 (cths/get-shape file :frame-2)
- events [(wtch/apply-token {:shape-ids [(:id frame-1) (:id frame-2)]
+ events [(dwta/apply-token {:shape-ids [(:id frame-1) (:id frame-2)]
:attributes #{:padding}
:token (toht/get-token file "padding.sm")
- :on-update-shape wtch/update-layout-padding})]]
+ :on-update-shape dwta/update-layout-padding})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -303,10 +309,10 @@
#(ctob/add-token-in-set % "Set A" (ctob/make-token sizing-token))))
store (ths/setup-store file)
rect-1 (cths/get-shape file :rect-1)
- events [(wtch/apply-token {:shape-ids [(:id rect-1)]
+ events [(dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:width :height}
:token (toht/get-token file "sizing.sm")
- :on-update-shape wtch/update-shape-dimensions})]]
+ :on-update-shape dwta/update-shape-dimensions})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -344,18 +350,18 @@
rect-1 (cths/get-shape file :rect-1)
rect-2 (cths/get-shape file :rect-2)
rect-3 (cths/get-shape file :rect-3)
- events [(wtch/apply-token {:shape-ids [(:id rect-1)]
+ events [(dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:opacity}
:token (toht/get-token file "opacity.float")
- :on-update-shape wtch/update-opacity})
- (wtch/apply-token {:shape-ids [(:id rect-2)]
+ :on-update-shape dwta/update-opacity})
+ (dwta/apply-token {:shape-ids [(:id rect-2)]
:attributes #{:opacity}
:token (toht/get-token file "opacity.percent")
- :on-update-shape wtch/update-opacity})
- (wtch/apply-token {:shape-ids [(:id rect-3)]
+ :on-update-shape dwta/update-opacity})
+ (dwta/apply-token {:shape-ids [(:id rect-3)]
:attributes #{:opacity}
:token (toht/get-token file "opacity.invalid")
- :on-update-shape wtch/update-opacity})]]
+ :on-update-shape dwta/update-opacity})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -388,10 +394,10 @@
#(ctob/add-token-in-set % "Set A" (ctob/make-token rotation-token))))
store (ths/setup-store file)
rect-1 (cths/get-shape file :rect-1)
- events [(wtch/apply-token {:shape-ids [(:id rect-1)]
+ events [(dwta/apply-token {:shape-ids [(:id rect-1)]
:attributes #{:rotation}
:token (toht/get-token file "rotation.medium")
- :on-update-shape wtch/update-rotation})]]
+ :on-update-shape dwta/update-rotation})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -419,10 +425,10 @@
store (ths/setup-store file)
rect-with-stroke (cths/get-shape file :rect-1)
rect-without-stroke (cths/get-shape file :rect-2)
- events [(wtch/apply-token {:shape-ids [(:id rect-with-stroke) (:id rect-without-stroke)]
+ events [(dwta/apply-token {:shape-ids [(:id rect-with-stroke) (:id rect-without-stroke)]
:attributes #{:stroke-width}
:token (toht/get-token file "stroke-width.sm")
- :on-update-shape wtch/update-stroke-width})]]
+ :on-update-shape dwta/update-stroke-width})]]
(tohs/run-store-async
store done events
(fn [new-state]
@@ -445,9 +451,9 @@
store (ths/setup-store file)
rect-1 (cths/get-shape file :rect-1)
rect-2 (cths/get-shape file :rect-2)
- events [(wtch/toggle-token {:shapes [rect-1 rect-2]
+ events [(dwta/toggle-token {:shapes [rect-1 rect-2]
:token-type-props {:attributes #{:r1 :r2 :r3 :r4}
- :on-update-shape wtch/update-shape-radius-all}
+ :on-update-shape dwta/update-shape-radius-all}
:token (toht/get-token file "borderRadius.md")})]]
(tohs/run-store-async
store done events
@@ -476,7 +482,7 @@
rect-without-token (cths/get-shape file :rect-2)
rect-with-other-token (cths/get-shape file :rect-3)
- events [(wtch/toggle-token {:shapes [rect-with-token rect-without-token rect-with-other-token]
+ events [(dwta/toggle-token {:shapes [rect-with-token rect-without-token rect-with-other-token]
:token (toht/get-token file "borderRadius.sm")
:token-type-props {:attributes #{:r1 :r2 :r3 :r4}}})]]
(tohs/run-store-async
@@ -509,7 +515,7 @@
rect-without-token (cths/get-shape file :rect-2)
rect-with-other-token-2 (cths/get-shape file :rect-3)
- events [(wtch/toggle-token {:shapes [rect-with-other-token-1 rect-without-token rect-with-other-token-2]
+ events [(dwta/toggle-token {:shapes [rect-with-other-token-1 rect-without-token rect-with-other-token-2]
:token (toht/get-token file "borderRadius.sm")
:token-type-props {:attributes #{:r1 :r2 :r3 :r4}}})]]
(tohs/run-store-async
diff --git a/frontend/test/frontend_tests/tokens/logic/token_data_test.cljs b/frontend/test/frontend_tests/tokens/logic/token_data_test.cljs
new file mode 100644
index 0000000000..0329d05f1f
--- /dev/null
+++ b/frontend/test/frontend_tests/tokens/logic/token_data_test.cljs
@@ -0,0 +1,67 @@
+;; 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 frontend-tests.tokens.logic.token-data-test
+ (:require
+ [app.common.test-helpers.files :as cthf]
+ [app.common.types.tokens-lib :as ctob]
+ [app.main.data.workspace.tokens.library-edit :as dwtl]
+ [cljs.test :as t :include-macros true]
+ [frontend-tests.helpers.pages :as thp]
+ [frontend-tests.helpers.state :as ths]
+ [frontend-tests.tokens.helpers.state :as tohs]
+ [frontend-tests.tokens.helpers.tokens :as toht]))
+
+(t/use-fixtures :each
+ {:before thp/reset-idmap!})
+
+(defn setup-file []
+ (cthf/sample-file :file-1 :page-label :page-1))
+
+(defn setup-file-with-token-lib
+ []
+ (-> (setup-file)
+ (assoc-in [:data :tokens-lib]
+ (-> (ctob/make-tokens-lib)
+ (ctob/add-set (ctob/make-token-set :name "Set A"))))))
+
+(t/deftest duplicate-set
+ (t/async
+ done
+ (let [file (setup-file-with-token-lib)
+ store (ths/setup-store file)
+ events [(dwtl/duplicate-token-set "Set A" false)]]
+
+ (tohs/run-store-async
+ store done events
+ (fn [new-state]
+ (let [file' (ths/get-file-from-state new-state)
+ token-lib (toht/get-tokens-lib file')
+ sets (ctob/get-sets token-lib)
+ set (ctob/get-set token-lib "Set A")]
+
+ (t/testing "Token lib contains two sets"
+ (t/is (= (count sets) 2))
+ (t/is (some? set)))))))))
+
+(t/deftest duplicate-non-exist-set
+ (t/async
+ done
+ (let [file (setup-file-with-token-lib)
+ store (ths/setup-store file)
+ events [(dwtl/duplicate-token-set "Set B" false)]]
+
+ (tohs/run-store-async
+ store done events
+ (fn [new-state]
+ (let [file' (ths/get-file-from-state new-state)
+ token-lib (toht/get-tokens-lib file')
+ sets (ctob/get-sets token-lib)
+ set (ctob/get-set token-lib "Set B")]
+
+ (t/testing "Token lib contains one set"
+ (t/is (= (count sets) 1))
+ (t/is (nil? set)))))))))
\ No newline at end of file
diff --git a/frontend/test/frontend_tests/tokens/style_dictionary_test.cljs b/frontend/test/frontend_tests/tokens/style_dictionary_test.cljs
index 64841fb654..09d298678f 100644
--- a/frontend/test/frontend_tests/tokens/style_dictionary_test.cljs
+++ b/frontend/test/frontend_tests/tokens/style_dictionary_test.cljs
@@ -1,8 +1,14 @@
+;; 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 frontend-tests.tokens.style-dictionary-test
(:require
[app.common.transit :as tr]
[app.common.types.tokens-lib :as ctob]
- [app.main.ui.workspace.tokens.style-dictionary :as sd]
+ [app.main.data.style-dictionary :as sd]
[beicon.v2.core :as rx]
[cljs.test :as t :include-macros true]
[promesa.core :as p]))
@@ -133,3 +139,29 @@ color.value tries to reference missing, which is not defined.")))
(fn [err]
(t/is (= :error.import/style-dictionary-reference-errors (:error/code (ex-data err))))
(done))))))))
+
+(t/deftest single-set-legacy-json-decoding
+ (let [decode-single-set-legacy-json #'sd/decode-single-set-legacy-json
+ json {"color" {"red" {"100" {"value" "red"
+ "type" "color"
+ "description" ""}}}}
+ lib (decode-single-set-legacy-json (ctob/ensure-tokens-lib nil) "single_set" json)
+ get-set-token (fn [set-name token-name]
+ (some-> (ctob/get-set lib set-name)
+ (ctob/get-token token-name)))]
+ (t/is (= '("single_set") (ctob/get-ordered-set-names lib)))
+ (t/testing "token added"
+ (t/is (some? (get-set-token "single_set" "color.red.100"))))))
+
+(t/deftest single-set-dtcg-json-decoding
+ (let [decode-single-set-json #'sd/decode-single-set-json
+ json (-> {"color" {"red" {"100" {"$value" "red"
+ "$type" "color"
+ "$description" ""}}}})
+ lib (decode-single-set-json (ctob/ensure-tokens-lib nil) "single_set" json)
+ get-set-token (fn [set-name token-name]
+ (some-> (ctob/get-set lib set-name)
+ (ctob/get-token token-name)))]
+ (t/is (= '("single_set") (ctob/get-ordered-set-names lib)))
+ (t/testing "token added"
+ (t/is (some? (get-set-token "single_set" "color.red.100"))))))
diff --git a/frontend/translations/af.po b/frontend/translations/af.po
index 7efb227dc6..aa638fba3b 100644
--- a/frontend/translations/af.po
+++ b/frontend/translations/af.po
@@ -34,13 +34,13 @@ msgstr "Skep demo rekening"
msgid "auth.create-demo-profile"
msgstr "Wil jy dit net probeer?"
-#: src/app/main/ui/auth/login.cljs:42
+#: src/app/main/ui/auth/login.cljs:43
msgid "auth.demo-warning"
msgstr ""
"Dit is 'n DEMO-diens, MOENIE vir werklike werk gebruik nie, die projekte "
"sal periodiek uitgevee word."
-#: src/app/main/ui/auth/login.cljs:190, src/app/main/ui/viewer/login.cljs:84
+#: src/app/main/ui/auth/login.cljs:189, src/app/main/ui/viewer/login.cljs:84
msgid "auth.forgot-password"
msgstr "Wagwoord vergeet?"
@@ -52,27 +52,27 @@ msgstr "Volle naam"
msgid "auth.login-here"
msgstr "Meld hier aan"
-#: src/app/main/ui/auth/login.cljs:196
+#: src/app/main/ui/auth/login.cljs:195
msgid "auth.login-submit"
msgstr "Meld aan"
-#: src/app/main/ui/auth/login.cljs:223
+#: src/app/main/ui/auth/login.cljs:222
msgid "auth.login-with-github-submit"
msgstr "GitHub"
-#: src/app/main/ui/auth/login.cljs:229
+#: src/app/main/ui/auth/login.cljs:228
msgid "auth.login-with-gitlab-submit"
msgstr "GitLab"
-#: src/app/main/ui/auth/login.cljs:217
+#: src/app/main/ui/auth/login.cljs:216
msgid "auth.login-with-google-submit"
msgstr "Google"
-#: src/app/main/ui/auth/login.cljs:202
+#: src/app/main/ui/auth/login.cljs:201
msgid "auth.login-with-ldap-submit"
msgstr "LDAP"
-#: src/app/main/ui/auth/login.cljs:235, src/app/main/ui/auth/login.cljs:256
+#: src/app/main/ui/auth/login.cljs:234, src/app/main/ui/auth/login.cljs:255
msgid "auth.login-with-oidc-submit"
msgstr "OpenID"
@@ -98,7 +98,7 @@ msgstr "Wagwoordherwinningskakel na jou inkassie gestuur."
msgid "auth.notifications.team-invitation-accepted"
msgstr "Het suksesvol by die span aangesluit"
-#: src/app/main/ui/auth/login.cljs:180, src/app/main/ui/auth/register.cljs:95
+#: src/app/main/ui/auth/login.cljs:179, src/app/main/ui/auth/register.cljs:95
msgid "auth.password"
msgstr "Wagwoord"
@@ -126,11 +126,11 @@ msgstr "Wagwoord vergeet?"
msgid "auth.recovery-submit"
msgstr "Verander jou wagwoord"
-#: src/app/main/ui/auth/login.cljs:299, src/app/main/ui/static.cljs:141, src/app/main/ui/viewer/login.cljs:87
+#: src/app/main/ui/auth/login.cljs:298, src/app/main/ui/static.cljs:141, src/app/main/ui/viewer/login.cljs:87
msgid "auth.register"
msgstr "Nog nie 'n rekening nie?"
-#: src/app/main/ui/auth/login.cljs:303, src/app/main/ui/auth/register.cljs:101, src/app/main/ui/auth/register.cljs:240, src/app/main/ui/static.cljs:145, src/app/main/ui/viewer/login.cljs:91
+#: src/app/main/ui/auth/login.cljs:302, src/app/main/ui/auth/register.cljs:101, src/app/main/ui/auth/register.cljs:240, src/app/main/ui/static.cljs:145, src/app/main/ui/viewer/login.cljs:91
msgid "auth.register-submit"
msgstr "Skep 'n rekening"
@@ -143,7 +143,7 @@ msgstr "Skep 'n rekening"
msgid "auth.sidebar-tagline"
msgstr "Die oopbron-oplossing vir ontwerp en prototipering."
-#: src/app/main/ui/auth/register.cljs:290, src/app/main/ui/dashboard/sidebar.cljs:1053, src/app/main/ui/workspace/main_menu.cljs:154
+#: src/app/main/ui/auth/register.cljs:290, src/app/main/ui/dashboard/sidebar.cljs:1054, src/app/main/ui/workspace/main_menu.cljs:154
msgid "auth.terms-of-service"
msgstr "Diensbepalings"
@@ -162,7 +162,7 @@ msgstr "Ons het 'n verifikasie-e-pos aan gestuur"
msgid "branding-illustrations-marketing-pieces"
msgstr "...handelsmerk, illustrasies, bemarkingsstukke, ens."
-#: src/app/main/ui/workspace/libraries.cljs:311
+#: src/app/main/ui/workspace/libraries.cljs:308
msgid "common.publish"
msgstr "Publiseer"
@@ -234,7 +234,7 @@ msgstr "Deel prototipes"
msgid "common.share-link.view-all"
msgstr "Kies Alles"
-#: src/app/main/ui/workspace/libraries.cljs:307
+#: src/app/main/ui/workspace/libraries.cljs:304
msgid "common.unpublish"
msgstr "Depubliseer"
@@ -281,7 +281,7 @@ msgstr "Koppelvlak Deurloop"
msgid "dashboard.access-tokens.copied-success"
msgstr "Token gekopieer"
-#: src/app/main/ui/settings/access_tokens.cljs:191
+#: src/app/main/ui/settings/access_tokens.cljs:190
msgid "dashboard.access-tokens.create"
msgstr "Genereer nuwe token"
@@ -289,11 +289,11 @@ msgstr "Genereer nuwe token"
msgid "dashboard.access-tokens.create.success"
msgstr "Toegangstoken is suksesvol geskep."
-#: src/app/main/ui/settings/access_tokens.cljs:289
+#: src/app/main/ui/settings/access_tokens.cljs:288
msgid "dashboard.access-tokens.empty.add-one"
msgstr "Druk die knoppie \"Genereer nuwe token\" om een te genereer."
-#: src/app/main/ui/settings/access_tokens.cljs:288
+#: src/app/main/ui/settings/access_tokens.cljs:287
msgid "dashboard.access-tokens.empty.no-access-tokens"
msgstr "Jy het tot dusver geen tokens nie."
@@ -317,23 +317,23 @@ msgstr "90 dae"
msgid "dashboard.access-tokens.expiration-never"
msgstr "Nooit"
-#: src/app/main/ui/settings/access_tokens.cljs:271
+#: src/app/main/ui/settings/access_tokens.cljs:270
msgid "dashboard.access-tokens.expired-on"
msgstr "Het verval op %s"
-#: src/app/main/ui/settings/access_tokens.cljs:272
+#: src/app/main/ui/settings/access_tokens.cljs:271
msgid "dashboard.access-tokens.expires-on"
msgstr "Verval op %s"
-#: src/app/main/ui/settings/access_tokens.cljs:270
+#: src/app/main/ui/settings/access_tokens.cljs:269
msgid "dashboard.access-tokens.no-expiration"
msgstr "Geen verval datum nie"
-#: src/app/main/ui/settings/access_tokens.cljs:186
+#: src/app/main/ui/settings/access_tokens.cljs:185
msgid "dashboard.access-tokens.personal"
msgstr "Persoonlike toegangstokens"
-#: src/app/main/ui/settings/access_tokens.cljs:187
+#: src/app/main/ui/settings/access_tokens.cljs:186
msgid "dashboard.access-tokens.personal.description"
msgstr ""
"Persoonlike toegangtokens funksioneer soos 'n alternatief vir ons "
@@ -356,7 +356,7 @@ msgstr "Voeg by as Gedeelde Biblioteek"
msgid "dashboard.change-email"
msgstr "Verander e-pos"
-#: src/app/main/data/dashboard.cljs:288, src/app/main/data/dashboard.cljs:507
+#: src/app/main/data/dashboard.cljs:298, src/app/main/data/dashboard.cljs:526, src/app/main/data/workspace.cljs:544
msgid "dashboard.copy-suffix"
msgstr "(kopieer)"
diff --git a/frontend/translations/ar.po b/frontend/translations/ar.po
index 1928764b8f..12fb8644f1 100644
--- a/frontend/translations/ar.po
+++ b/frontend/translations/ar.po
@@ -33,11 +33,11 @@ msgstr "إنشاء حساب تجريبي"
msgid "auth.create-demo-profile"
msgstr "ترغب في التجربة فحسب؟"
-#: src/app/main/ui/auth/login.cljs:42
+#: src/app/main/ui/auth/login.cljs:43
msgid "auth.demo-warning"
msgstr "هذه خدمة تجريبية ، لا تستخدمها للعمل الحقيقي ، سيتم مسح المشاريع بشكل دوري."
-#: src/app/main/ui/auth/login.cljs:190, src/app/main/ui/viewer/login.cljs:84
+#: src/app/main/ui/auth/login.cljs:189, src/app/main/ui/viewer/login.cljs:84
msgid "auth.forgot-password"
msgstr "هل نسيت كلمة السر؟"
@@ -45,7 +45,7 @@ msgstr "هل نسيت كلمة السر؟"
msgid "auth.fullname"
msgstr "الاسم الكامل"
-#: src/app/main/ui/auth/login.cljs:283
+#: src/app/main/ui/auth/login.cljs:282
msgid "auth.login-account-title"
msgstr "قم بتسجيل الدخول إلى حسابي"
@@ -53,31 +53,31 @@ msgstr "قم بتسجيل الدخول إلى حسابي"
msgid "auth.login-here"
msgstr "تسجيل الدخول هنا"
-#: src/app/main/ui/auth/login.cljs:196
+#: src/app/main/ui/auth/login.cljs:195
msgid "auth.login-submit"
msgstr "تسجيل الدخول"
-#: src/app/main/ui/auth/login.cljs:286
+#: src/app/main/ui/auth/login.cljs:285
msgid "auth.login-tagline"
msgstr "Penpot هو أداة تصميم مجانية ومفتوحة المصدر للتعاون بين التصميم والبرمجة"
-#: src/app/main/ui/auth/login.cljs:223
+#: src/app/main/ui/auth/login.cljs:222
msgid "auth.login-with-github-submit"
msgstr "Github"
-#: src/app/main/ui/auth/login.cljs:229
+#: src/app/main/ui/auth/login.cljs:228
msgid "auth.login-with-gitlab-submit"
msgstr "Gitlabسجل دخولك عن طريق"
-#: src/app/main/ui/auth/login.cljs:217
+#: src/app/main/ui/auth/login.cljs:216
msgid "auth.login-with-google-submit"
msgstr "جوجل"
-#: src/app/main/ui/auth/login.cljs:202
+#: src/app/main/ui/auth/login.cljs:201
msgid "auth.login-with-ldap-submit"
msgstr "LDAPسجل دخولك عن طريق"
-#: src/app/main/ui/auth/login.cljs:235, src/app/main/ui/auth/login.cljs:256
+#: src/app/main/ui/auth/login.cljs:234, src/app/main/ui/auth/login.cljs:255
msgid "auth.login-with-oidc-submit"
msgstr "OpenID سجل دخولك عن طريق"
@@ -101,7 +101,7 @@ msgstr "تم إرسال رمز الاسترداد لاستعادة كلمة ال
msgid "auth.notifications.team-invitation-accepted"
msgstr "تم الانضمام إلى الفريق بنجاح"
-#: src/app/main/ui/auth/login.cljs:180, src/app/main/ui/auth/register.cljs:95
+#: src/app/main/ui/auth/login.cljs:179, src/app/main/ui/auth/register.cljs:95
msgid "auth.password"
msgstr "كلمه السر"
@@ -129,11 +129,11 @@ msgstr "نسيت كلمة المرور؟"
msgid "auth.recovery-submit"
msgstr "تغيير كلمة المرور"
-#: src/app/main/ui/auth/login.cljs:299, src/app/main/ui/static.cljs:141, src/app/main/ui/viewer/login.cljs:87
+#: src/app/main/ui/auth/login.cljs:298, src/app/main/ui/static.cljs:141, src/app/main/ui/viewer/login.cljs:87
msgid "auth.register"
msgstr "لا تملك حساب بعد؟"
-#: src/app/main/ui/auth/login.cljs:303, src/app/main/ui/auth/register.cljs:101, src/app/main/ui/auth/register.cljs:240, src/app/main/ui/static.cljs:145, src/app/main/ui/viewer/login.cljs:91
+#: src/app/main/ui/auth/login.cljs:302, src/app/main/ui/auth/register.cljs:101, src/app/main/ui/auth/register.cljs:240, src/app/main/ui/static.cljs:145, src/app/main/ui/viewer/login.cljs:91
msgid "auth.register-submit"
msgstr "إنشاء حساب"
@@ -146,7 +146,7 @@ msgstr "إنشاء حساب"
msgid "auth.sidebar-tagline"
msgstr "الحل (مفتوح المصدر) للتصميم والنمذجة."
-#: src/app/main/ui/auth/register.cljs:290, src/app/main/ui/dashboard/sidebar.cljs:1053, src/app/main/ui/workspace/main_menu.cljs:154
+#: src/app/main/ui/auth/register.cljs:290, src/app/main/ui/dashboard/sidebar.cljs:1054, src/app/main/ui/workspace/main_menu.cljs:154
msgid "auth.terms-of-service"
msgstr "شروط الخدمة"
@@ -163,7 +163,7 @@ msgstr "لقد أرسلنا رسالة تحقق إلى بريدك الالكتر
msgid "branding-illustrations-marketing-pieces"
msgstr "...علامة تجارية، رسوم توضيحية، قطع تسويقية، إلخ."
-#: src/app/main/ui/workspace/libraries.cljs:311
+#: src/app/main/ui/workspace/libraries.cljs:308
msgid "common.publish"
msgstr "أنشر"
@@ -239,7 +239,7 @@ msgstr "مشاركة النماذج"
msgid "common.share-link.view-all"
msgstr "اختر الكل"
-#: src/app/main/ui/workspace/libraries.cljs:307
+#: src/app/main/ui/workspace/libraries.cljs:304
msgid "common.unpublish"
msgstr "إلغاء النشر"
@@ -289,7 +289,7 @@ msgstr "جولة في الواجهة"
msgid "dashboard.access-tokens.copied-success"
msgstr "الرمز منسوخ"
-#: src/app/main/ui/settings/access_tokens.cljs:191
+#: src/app/main/ui/settings/access_tokens.cljs:190
msgid "dashboard.access-tokens.create"
msgstr "قم بإنشاء رمز جديد"
@@ -297,7 +297,7 @@ msgstr "قم بإنشاء رمز جديد"
msgid "dashboard.access-tokens.create.success"
msgstr "تم إنشاء رمز الوصول بنجاح."
-#: src/app/main/ui/settings/access_tokens.cljs:289
+#: src/app/main/ui/settings/access_tokens.cljs:288
msgid "dashboard.access-tokens.empty.add-one"
msgstr "اضغط على الزر \"إنشاء رمز جديد\" لإنشاء واحد."
@@ -309,7 +309,7 @@ msgstr "أضف كمكتبة مشتركة"
msgid "dashboard.change-email"
msgstr "تغيير البريد الإلكتروني"
-#: src/app/main/data/dashboard.cljs:288, src/app/main/data/dashboard.cljs:507
+#: src/app/main/data/dashboard.cljs:298, src/app/main/data/dashboard.cljs:526, src/app/main/data/workspace.cljs:544
msgid "dashboard.copy-suffix"
msgstr "(نسخة)"
@@ -427,19 +427,19 @@ msgstr "تضمين أصول المكتبة المشتركة في مكتبات ا
msgid "dashboard.export.title"
msgstr "صدر الملفات"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:313
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:316
msgid "dashboard.fonts.deleted-placeholder"
msgstr "الخط محذوف"
-#: src/app/main/ui/dashboard/fonts.cljs:210
+#: src/app/main/ui/dashboard/fonts.cljs:212
msgid "dashboard.fonts.dismiss-all"
msgstr "الغاء الكل"
-#: src/app/main/ui/dashboard/fonts.cljs:445
+#: src/app/main/ui/dashboard/fonts.cljs:447
msgid "dashboard.fonts.empty-placeholder"
msgstr "لا يزال ليس لديك خطوط مخصصة مثبتة."
-#: src/app/main/ui/dashboard/fonts.cljs:198
+#: src/app/main/ui/dashboard/fonts.cljs:200
msgid "dashboard.fonts.fonts-added"
msgid_plural "dashboard.fonts.fonts-added"
msgstr[0] "لم يتم إضافة أي خط"
@@ -449,7 +449,7 @@ msgstr[3] "عدد قليل من الخطوط المضافة"
msgstr[4] "تمت إضافة العديد من الخطوط"
msgstr[5] ""
-#: src/app/main/ui/dashboard/fonts.cljs:174
+#: src/app/main/ui/dashboard/fonts.cljs:175
#, markdown
msgid "dashboard.fonts.hero-text1"
msgstr ""
@@ -458,20 +458,19 @@ msgstr ""
"عائلة الخطوط على أنها ** عائلة خط واحدة **. يمكنك تحميل الخطوط بالتنسيقات "
"التالية: ** TTF و OTF و WOFF ** (ستحتاج إلى تنسيق واحد فقط)."
-#: src/app/main/ui/dashboard/fonts.cljs:186
+#: src/app/main/ui/dashboard/fonts.cljs:188
#, markdown
msgid "dashboard.fonts.hero-text2"
msgstr ""
"يجب عليك فقط تحميل الخطوط التي تمتلكها أو لديك ترخيص لاستخدامها في Penpot. "
-"اكتشف المزيد في قسم حقوق المحتوى في [شروط خدمة Penpot] "
-"(%s). قد ترغب أيضًا في القراءة عن [ترخيص الخطوط] "
-"(2)."
+"اكتشف المزيد في قسم حقوق المحتوى في [شروط خدمة Penpot] (%s). قد ترغب أيضًا "
+"في القراءة عن [ترخيص الخطوط] (2)."
-#: src/app/main/ui/dashboard/fonts.cljs:206
+#: src/app/main/ui/dashboard/fonts.cljs:208
msgid "dashboard.fonts.upload-all"
msgstr "حمل الكل"
-#: src/app/main/ui/dashboard/fonts.cljs:191
+#: src/app/main/ui/dashboard/fonts.cljs:193
#, markdown
msgid "dashboard.fonts.warning-text"
msgstr ""
@@ -481,7 +480,7 @@ msgstr ""
"، نوصي باستخدام [Transfonter] (https://transfonter.org/) لإنشاء خطوط الويب "
"وإصلاح الأخطاء. "
-#: src/app/main/ui/dashboard/import.cljs:452, src/app/main/ui/dashboard/project_menu.cljs:109
+#: src/app/main/ui/dashboard/import.cljs:454, src/app/main/ui/dashboard/project_menu.cljs:109
msgid "dashboard.import"
msgstr "استيراد ملفات"
@@ -493,11 +492,11 @@ msgstr "لم نستطع استيراد أو إدراج هذا الملف"
msgid "dashboard.import.import-error"
msgstr "حصل خلل خلال إدراج الملف. لم يتم إدراج الملف على البرنامج."
-#: src/app/main/ui/dashboard/import.cljs:466
+#: src/app/main/ui/dashboard/import.cljs:468
msgid "dashboard.import.import-message"
msgstr "%s ملف تم ادراجهم بنجاح."
-#: src/app/main/ui/dashboard/import.cljs:461
+#: src/app/main/ui/dashboard/import.cljs:463
msgid "dashboard.import.import-warning"
msgstr "تحتوي بعض الملفات على كائنات غير صالحة تمت إزالتها."
@@ -537,27 +536,27 @@ msgstr "قم بدعوة للفريق"
msgid "dashboard.leave-team"
msgstr "ترك الفريق"
-#: src/app/main/ui/dashboard/templates.cljs:82, src/app/main/ui/dashboard/templates.cljs:157
+#: src/app/main/ui/dashboard/templates.cljs:83, src/app/main/ui/dashboard/templates.cljs:168
msgid "dashboard.libraries-and-templates"
msgstr "المكتبات & القوالب"
-#: src/app/main/ui/dashboard/templates.cljs:158
+#: src/app/main/ui/dashboard/templates.cljs:169
msgid "dashboard.libraries-and-templates.explore"
msgstr "استعرض المزيد منهم وتعلم كيف تساهم"
-#: src/app/main/ui/dashboard/import.cljs:358, src/app/main/ui/workspace/libraries.cljs:150
+#: src/app/main/ui/dashboard/import.cljs:360, src/app/main/ui/workspace/libraries.cljs:151
msgid "dashboard.libraries-and-templates.import-error"
msgstr "حدثت مشكلة في استيراد النموذج. لم يتم استيراد النموذج."
-#: src/app/main/ui/dashboard/libraries.cljs:51
+#: src/app/main/ui/dashboard/libraries.cljs:66
msgid "dashboard.libraries-title"
msgstr "المكتبات المشتركة"
-#: src/app/main/ui/dashboard/placeholder.cljs:55
+#: src/app/main/ui/dashboard/placeholder.cljs:100
msgid "dashboard.loading-files"
msgstr "تحميل ملفاتك …"
-#: src/app/main/ui/dashboard/fonts.cljs:439
+#: src/app/main/ui/dashboard/fonts.cljs:441
msgid "dashboard.loading-fonts"
msgstr "جاري تحميل الخطوط …"
@@ -573,11 +572,11 @@ msgstr "أنقل %s الملفات إلى"
msgid "dashboard.move-to-other-team"
msgstr "الانتقال إلى فريق آخر"
-#: src/app/main/ui/dashboard/files.cljs:105, src/app/main/ui/dashboard/projects.cljs:252, src/app/main/ui/dashboard/projects.cljs:253
+#: src/app/main/ui/dashboard/files.cljs:105, src/app/main/ui/dashboard/projects.cljs:253, src/app/main/ui/dashboard/projects.cljs:254
msgid "dashboard.new-file"
msgstr "+ ملف جديد"
-#: src/app/main/data/dashboard.cljs:482, src/app/main/data/dashboard.cljs:591
+#: src/app/main/data/dashboard.cljs:497, src/app/main/data/dashboard.cljs:609
msgid "dashboard.new-file-prefix"
msgstr "ملف جديد"
@@ -585,7 +584,7 @@ msgstr "ملف جديد"
msgid "dashboard.new-project"
msgstr "+ مشروع جديد"
-#: src/app/main/data/dashboard.cljs:252, src/app/main/data/dashboard.cljs:594
+#: src/app/main/data/dashboard.cljs:257, src/app/main/data/dashboard.cljs:612
msgid "dashboard.new-project-prefix"
msgstr "مشروع جديد"
@@ -617,7 +616,7 @@ msgstr "%s الأعضاء"
msgid "dashboard.open-in-new-tab"
msgstr "فتح ملف في علامة تبويب جديدة"
-#: src/app/main/ui/dashboard/files.cljs:118, src/app/main/ui/dashboard/projects.cljs:261, src/app/main/ui/dashboard/projects.cljs:262
+#: src/app/main/ui/dashboard/files.cljs:118, src/app/main/ui/dashboard/grid.cljs:426, src/app/main/ui/dashboard/projects.cljs:262, src/app/main/ui/dashboard/projects.cljs:263
msgid "dashboard.options"
msgstr "الخيارات"
@@ -662,7 +661,7 @@ msgstr "حدد لغة واجهة المستخدم"
msgid "dashboard.select-ui-theme"
msgstr "اختر نمطا"
-#: src/app/main/ui/dashboard/projects.cljs:304
+#: src/app/main/ui/dashboard/projects.cljs:305
msgid "dashboard.show-all-files"
msgstr "إظهار كافة الملفات"
@@ -682,7 +681,7 @@ msgstr "تم تكرار ملفك بنجاح"
msgid "dashboard.success-duplicate-project"
msgstr "تم نسخ مشروعك بنجاح"
-#: src/app/main/ui/dashboard/file_menu.cljs:131, src/app/main/ui/dashboard/grid.cljs:588, src/app/main/ui/dashboard/sidebar.cljs:159
+#: src/app/main/ui/dashboard/file_menu.cljs:131, src/app/main/ui/dashboard/grid.cljs:614, src/app/main/ui/dashboard/sidebar.cljs:159
msgid "dashboard.success-move-file"
msgstr "تم نقل ملفك بنجاح"
@@ -754,7 +753,7 @@ msgstr "البريد الالكتروني"
msgid "dashboard.your-name"
msgstr "اسمك"
-#: src/app/main/ui/dashboard/file_menu.cljs:39, src/app/main/ui/dashboard/fonts.cljs:35, src/app/main/ui/dashboard/libraries.cljs:40, src/app/main/ui/dashboard/projects.cljs:345, src/app/main/ui/dashboard/search.cljs:48, src/app/main/ui/dashboard/sidebar.cljs:319, src/app/main/ui/dashboard/team.cljs:531, src/app/main/ui/dashboard/team.cljs:781, src/app/main/ui/dashboard/team.cljs:1045, src/app/main/ui/dashboard/team.cljs:1092
+#: src/app/main/ui/dashboard/file_menu.cljs:39, src/app/main/ui/dashboard/fonts.cljs:36, src/app/main/ui/dashboard/libraries.cljs:55, src/app/main/ui/dashboard/projects.cljs:348, src/app/main/ui/dashboard/search.cljs:48, src/app/main/ui/dashboard/sidebar.cljs:319, src/app/main/ui/dashboard/team.cljs:531, src/app/main/ui/dashboard/team.cljs:781, src/app/main/ui/dashboard/team.cljs:1045, src/app/main/ui/dashboard/team.cljs:1092
msgid "dashboard.your-penpot"
msgstr "Penpot الخاص بك"
@@ -770,11 +769,11 @@ msgstr "إنتباه"
msgid "ds.component-subtitle"
msgstr "عناصر سيتم تحديثها:"
-#: src/app/main/ui/comments.cljs:653, src/app/main/ui/comments.cljs:686, src/app/main/ui/comments.cljs:755, src/app/main/ui/confirm.cljs:36, src/app/main/ui/workspace/plugins.cljs:330, src/app/main/ui/workspace/plugins.cljs:384
+#: src/app/main/ui/comments.cljs:672, src/app/main/ui/confirm.cljs:36, src/app/main/ui/workspace/plugins.cljs:330, src/app/main/ui/workspace/plugins.cljs:384
msgid "ds.confirm-cancel"
msgstr "إلغاء الأمر"
-#: src/app/main/ui/confirm.cljs:37, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:141
+#: src/app/main/ui/confirm.cljs:37, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:148
msgid "ds.confirm-ok"
msgstr "حسنا"
@@ -782,7 +781,7 @@ msgstr "حسنا"
msgid "ds.confirm-title"
msgstr "هل أنت متأكد؟"
-#: src/app/main/ui/auth/login.cljs:77
+#: src/app/main/ui/auth/login.cljs:78
msgid "errors.auth-provider-not-configured"
msgstr "موفر المصادقة غير معد ومسجل."
@@ -790,15 +789,15 @@ msgstr "موفر المصادقة غير معد ومسجل."
msgid "errors.auth.unable-to-login"
msgstr "يبدوا أنك غير مصرح لك أو أن الجلسة إنتهت."
-#: src/app/main/data/fonts.cljs:193, src/app/main/ui/dashboard/fonts.cljs:113
+#: src/app/main/data/fonts.cljs:192, src/app/main/ui/dashboard/fonts.cljs:114
msgid "errors.bad-font"
msgstr "تعذر تحميل الخط٪ s"
-#: src/app/main/data/fonts.cljs:192
+#: src/app/main/data/fonts.cljs:191
msgid "errors.bad-font-plural"
msgstr "تعذر تحميل الخطوط٪ s"
-#: src/app/main/data/workspace.cljs:1463, src/app/main/data/workspace.cljs:1660
+#: src/app/main/data/workspace.cljs:1484, src/app/main/data/workspace.cljs:1682
msgid "errors.clipboard-not-implemented"
msgstr "لا يمكن للمتصفح إجراء هذه العملية"
@@ -810,7 +809,7 @@ msgstr "البريد الإلكتروني مستخدم بالفعل"
msgid "errors.email-already-validated"
msgstr "متم التحقق من صحة البريد الإلكتروني"
-#, unused
+#: src/app/main/ui/auth/register.cljs:64, src/app/main/ui/settings/password.cljs:27
msgid "errors.email-as-password"
msgstr "لا يمكنك استخدام بريدك الإلكتروني ككلمة مرور"
@@ -832,7 +831,7 @@ msgstr ""
msgid "errors.feature-not-supported"
msgstr "الميزة '٪ s' غير مدعومة."
-#: src/app/main/data/auth.cljs:322, src/app/main/ui/auth/login.cljs:80, src/app/main/ui/auth/login.cljs:121, src/app/main/ui/auth/register.cljs:66, src/app/main/ui/auth/register.cljs:207, src/app/main/ui/auth/verify_token.cljs:94, src/app/main/ui/dashboard/team.cljs:193, src/app/main/ui/onboarding/team_choice.cljs:112, src/app/main/ui/settings/access_tokens.cljs:80, src/app/main/ui/settings/feedback.cljs:49
+#: src/app/main/data/auth.cljs:322, src/app/main/ui/auth/login.cljs:81, src/app/main/ui/auth/login.cljs:122, src/app/main/ui/auth/register.cljs:66, src/app/main/ui/auth/register.cljs:207, src/app/main/ui/auth/verify_token.cljs:94, src/app/main/ui/dashboard/team.cljs:193, src/app/main/ui/onboarding/team_choice.cljs:112, src/app/main/ui/settings/access_tokens.cljs:80, src/app/main/ui/settings/feedback.cljs:49
msgid "errors.generic"
msgstr "حدث خطأ ما."
@@ -845,8 +844,7 @@ msgstr "لون غير صالح"
msgid "errors.invalid-email"
msgstr "أدخل بريدًا إلكترونيًا صالحًا من فضلك"
-#: src/app/main/ui/settings/change_email.cljs
-#, unused
+#: src/app/main/ui/settings/change_email.cljs:62
msgid "errors.invalid-email-confirmation"
msgstr "يجب أن يتطابق البريد الإلكتروني للتأكيد"
@@ -862,7 +860,7 @@ msgstr "دعوة غير صالحة"
msgid "errors.invite-invalid.info"
msgstr "هذه الدعوة قد تلغى أو قد تنتهي."
-#: src/app/main/ui/auth/login.cljs:106
+#: src/app/main/ui/auth/login.cljs:107
msgid "errors.ldap-disabled"
msgstr "تم تعطيل مصادقة LDAP."
@@ -894,7 +892,7 @@ msgstr "يجب أن تتطابق كلمة مرور التأكيد"
msgid "errors.password-too-short"
msgstr "يجب ألا تقل كلمة المرور عن 8 أحرف"
-#: src/app/main/data/auth.cljs:312, src/app/main/ui/auth/login.cljs:102, src/app/main/ui/auth/login.cljs:110
+#: src/app/main/data/auth.cljs:312, src/app/main/ui/auth/login.cljs:103, src/app/main/ui/auth/login.cljs:111
msgid "errors.profile-blocked"
msgstr "هذا الملف الشخصي محظور"
@@ -948,12 +946,11 @@ msgstr "خطأ غير متوقع في التحقق"
msgid "errors.webhooks.unexpected-status"
msgstr "حالة غير متوقعة٪ s"
-#: src/app/main/ui/auth/login.cljs:114, src/app/main/ui/auth/login.cljs:118
+#: src/app/main/ui/auth/login.cljs:115, src/app/main/ui/auth/login.cljs:119
msgid "errors.wrong-credentials"
msgstr "يبدو أن اسم المستخدم أو كلمة المرور خاطئة."
-#: src/app/main/ui/settings/password.cljs
-#, unused
+#: src/app/main/ui/settings/password.cljs:24
msgid "errors.wrong-old-password"
msgstr "كلمة المرور القديمة غير صحيحة"
@@ -999,11 +996,11 @@ msgstr "هنا للمساعدة في استفساراتك التقنية."
msgid "feedback.twitter-title"
msgstr "رد عنوان تويتر"
-#: src/app/main/ui/settings/notifications.cljs:38, src/app/main/ui/settings/password.cljs:29
+#: src/app/main/ui/settings/password.cljs:29
msgid "generic.error"
msgstr "حدث خطأ"
-#: src/app/main/ui/viewer/inspect/attributes/blur.cljs:26
+#: src/app/main/ui/inspect/attributes/blur.cljs:26
msgid "inspect.attributes.blur"
msgstr "الضبابية"
@@ -1011,31 +1008,31 @@ msgstr "الضبابية"
msgid "inspect.attributes.blur.value"
msgstr "تفتيش قيمة الطمس"
-#: src/app/main/ui/viewer/inspect/attributes/common.cljs:112
+#: src/app/main/ui/inspect/attributes/common.cljs:112
msgid "inspect.attributes.color.hex"
msgstr "تفتيش صفات اللون"
-#: src/app/main/ui/viewer/inspect/attributes/common.cljs:114
+#: src/app/main/ui/inspect/attributes/common.cljs:114
msgid "inspect.attributes.color.hsla"
msgstr "HSLAتتفتيش صفات اللون"
-#: src/app/main/ui/viewer/inspect/attributes/common.cljs:113
+#: src/app/main/ui/inspect/attributes/common.cljs:113
msgid "inspect.attributes.color.rgba"
msgstr "RGBAفتش اللون"
-#: src/app/main/ui/viewer/inspect/attributes/fill.cljs:57
+#: src/app/main/ui/inspect/attributes/fill.cljs:57
msgid "inspect.attributes.fill"
msgstr "املأ"
-#: src/app/main/ui/viewer/inspect/attributes/common.cljs:99, src/app/main/ui/viewer/inspect/attributes/image.cljs:51
+#: src/app/main/ui/inspect/attributes/common.cljs:99, src/app/main/ui/inspect/attributes/image.cljs:51
msgid "inspect.attributes.image.download"
msgstr "تحميل صورة المصدر"
-#: src/app/main/ui/viewer/inspect/attributes/image.cljs:39
+#: src/app/main/ui/inspect/attributes/image.cljs:39
msgid "inspect.attributes.image.height"
msgstr "ارتفاع"
-#: src/app/main/ui/viewer/inspect/attributes/image.cljs:32
+#: src/app/main/ui/inspect/attributes/image.cljs:32
msgid "inspect.attributes.image.width"
msgstr "عرض"
@@ -1074,11 +1071,11 @@ msgstr "أعلى"
msgid "inspect.attributes.layout.width"
msgstr "عرض"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:57
+#: src/app/main/ui/inspect/attributes/shadow.cljs:57
msgid "inspect.attributes.shadow"
msgstr "ظلل"
-#: src/app/main/ui/viewer/inspect/attributes/stroke.cljs:52
+#: src/app/main/ui/inspect/attributes/stroke.cljs:52
msgid "inspect.attributes.stroke"
msgstr "لون الحدّ"
@@ -1115,127 +1112,127 @@ msgstr "صلب"
msgid "inspect.attributes.stroke.width"
msgstr "عرض"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:81, src/app/main/ui/viewer/inspect/attributes/text.cljs:194
+#: src/app/main/ui/inspect/attributes/text.cljs:83, src/app/main/ui/inspect/attributes/text.cljs:196
msgid "inspect.attributes.typography"
msgstr "صياغة الحروف"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:89, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:299
+#: src/app/main/ui/inspect/attributes/text.cljs:91, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:302
msgid "inspect.attributes.typography.font-family"
msgstr "عائلة الخط"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:107, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:317
+#: src/app/main/ui/inspect/attributes/text.cljs:109, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:320
msgid "inspect.attributes.typography.font-size"
msgstr "حجم الخط"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:98, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:333
+#: src/app/main/ui/inspect/attributes/text.cljs:100, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:336
msgid "inspect.attributes.typography.font-style"
msgstr "نوع الخط"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:116
+#: src/app/main/ui/inspect/attributes/text.cljs:118
msgid "inspect.attributes.typography.font-weight"
msgstr "وزن الخط"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:134, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:386
+#: src/app/main/ui/inspect/attributes/text.cljs:136, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:389
msgid "inspect.attributes.typography.letter-spacing"
msgstr "تباعد الحروف"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:125, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:369
+#: src/app/main/ui/inspect/attributes/text.cljs:127, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:372
msgid "inspect.attributes.typography.line-height"
msgstr "ارتفاع الخط"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:143
+#: src/app/main/ui/inspect/attributes/text.cljs:145
msgid "inspect.attributes.typography.text-decoration"
msgstr "زخرفة النص"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:145
+#: src/app/main/ui/inspect/attributes/text.cljs:147
msgid "inspect.attributes.typography.text-decoration.none"
msgstr "لا شئ"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:146
+#: src/app/main/ui/inspect/attributes/text.cljs:148
msgid "inspect.attributes.typography.text-decoration.strikethrough"
msgstr "يتوسطه خط"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:147
+#: src/app/main/ui/inspect/attributes/text.cljs:149
msgid "inspect.attributes.typography.text-decoration.underline"
msgstr "مسطر"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:156
+#: src/app/main/ui/inspect/attributes/text.cljs:158
msgid "inspect.attributes.typography.text-transform"
msgstr "تغيير النص"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:158, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:429
+#: src/app/main/ui/inspect/attributes/text.cljs:160, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:432
msgid "inspect.attributes.typography.text-transform.lowercase"
msgstr "أحرف صغيرة"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:159
+#: src/app/main/ui/inspect/attributes/text.cljs:161
msgid "inspect.attributes.typography.text-transform.none"
msgstr "لا شئ"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:160, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:425
+#: src/app/main/ui/inspect/attributes/text.cljs:162, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:428
msgid "inspect.attributes.typography.text-transform.titlecase"
msgstr "حالة العنوان"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:161, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:419
+#: src/app/main/ui/inspect/attributes/text.cljs:163, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:422
msgid "inspect.attributes.typography.text-transform.uppercase"
msgstr "الأحرف الكبيرة"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:152
+#: src/app/main/ui/inspect/right_sidebar.cljs:163
msgid "inspect.empty.help"
msgstr "إذا كنت تريد معرفة المزيد عن فحص التصميم ، فتفضل بزيارة مركز مساعدة لPenpot"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:100
+#: src/app/main/ui/inspect/right_sidebar.cljs:105
msgid "inspect.tabs.code"
msgstr "شفرة"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:124
+#: src/app/main/ui/inspect/right_sidebar.cljs:129
msgid "inspect.tabs.code.selected.circle"
msgstr "دائرة"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:125
+#: src/app/main/ui/inspect/right_sidebar.cljs:130
msgid "inspect.tabs.code.selected.component"
msgstr "مكون"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:126
+#: src/app/main/ui/inspect/right_sidebar.cljs:131
msgid "inspect.tabs.code.selected.curve"
msgstr "منحنى"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:127
+#: src/app/main/ui/inspect/right_sidebar.cljs:132
msgid "inspect.tabs.code.selected.frame"
msgstr "لوح الرسم"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:128
+#: src/app/main/ui/inspect/right_sidebar.cljs:133
msgid "inspect.tabs.code.selected.group"
msgstr "مجموعة"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:129
+#: src/app/main/ui/inspect/right_sidebar.cljs:134
msgid "inspect.tabs.code.selected.image"
msgstr "صورة"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:130
+#: src/app/main/ui/inspect/right_sidebar.cljs:135
msgid "inspect.tabs.code.selected.mask"
msgstr "قناع"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:119
+#: src/app/main/ui/inspect/right_sidebar.cljs:124
msgid "inspect.tabs.code.selected.multiple"
msgstr "%s محدد"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:131
+#: src/app/main/ui/inspect/right_sidebar.cljs:136
msgid "inspect.tabs.code.selected.path"
msgstr "مسار"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:132
+#: src/app/main/ui/inspect/right_sidebar.cljs:137
msgid "inspect.tabs.code.selected.rect"
msgstr "رباعي"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:133
+#: src/app/main/ui/inspect/right_sidebar.cljs:138
msgid "inspect.tabs.code.selected.svg-raw"
msgstr "SVG"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:134
+#: src/app/main/ui/inspect/right_sidebar.cljs:139
msgid "inspect.tabs.code.selected.text"
msgstr "نص"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:96
+#: src/app/main/ui/inspect/right_sidebar.cljs:101
msgid "inspect.tabs.info"
msgstr "معلومات"
@@ -1247,7 +1244,7 @@ msgstr "الاختصارات"
msgid "labels.accept"
msgstr "إقبل"
-#: src/app/main/ui/dashboard/fonts.cljs:179
+#: src/app/main/ui/dashboard/fonts.cljs:180
msgid "labels.add-custom-font"
msgstr "إضافة خط مخصص"
@@ -1255,7 +1252,7 @@ msgstr "إضافة خط مخصص"
msgid "labels.admin"
msgstr "مشرف"
-#: src/app/main/ui/workspace/tokens/context_menu.cljs:63, src/app/main/ui/workspace/tokens/context_menu.cljs:101, src/app/main/ui/workspace/tokens/token_pill.cljs:110
+#: src/app/main/ui/workspace/tokens/context_menu.cljs:66, src/app/main/ui/workspace/tokens/context_menu.cljs:100, src/app/main/ui/workspace/tokens/token_pill.cljs:118
msgid "labels.all"
msgstr "الكل"
@@ -1277,19 +1274,19 @@ msgstr ""
msgid "labels.bad-gateway.main-message"
msgstr "مدخل خاطأ"
-#: src/app/main/data/common.cljs:135, src/app/main/ui/dashboard/change_owner.cljs:66, src/app/main/ui/dashboard/import.cljs:489, src/app/main/ui/dashboard/team.cljs:916, src/app/main/ui/delete_shared.cljs:35, src/app/main/ui/exports/assets.cljs:161, src/app/main/ui/exports/files.cljs:192, src/app/main/ui/settings/access_tokens.cljs:177, src/app/main/ui/viewer/share_link.cljs:204, src/app/main/ui/workspace/sidebar/assets/groups.cljs:145, src/app/main/ui/workspace/tokens/form.cljs:506, src/app/main/ui/workspace/tokens/modals/themes.cljs:198
+#: src/app/main/data/common.cljs:135, src/app/main/ui/dashboard/change_owner.cljs:66, src/app/main/ui/dashboard/import.cljs:489, src/app/main/ui/dashboard/team.cljs:916, src/app/main/ui/delete_shared.cljs:35, src/app/main/ui/exports/assets.cljs:161, src/app/main/ui/exports/files.cljs:192, src/app/main/ui/settings/access_tokens.cljs:176, src/app/main/ui/viewer/share_link.cljs:204, src/app/main/ui/workspace/sidebar/assets/groups.cljs:145, src/app/main/ui/workspace/tokens/form.cljs:572, src/app/main/ui/workspace/tokens/modals/themes.cljs:234
msgid "labels.cancel"
msgstr "الغاء"
-#: src/app/main/ui/dashboard/comments.cljs:87, src/app/main/ui/dashboard/projects.cljs:99, src/app/main/ui/exports/files.cljs:210, src/app/main/ui/settings/access_tokens.cljs:172, src/app/main/ui/viewer/login.cljs:71, src/app/main/ui/viewer/share_link.cljs:175, src/app/main/ui/workspace/comments.cljs:125, src/app/main/ui/workspace/libraries.cljs:645, src/app/main/ui/workspace/sidebar/debug.cljs:40, src/app/main/ui/workspace/sidebar/layers.cljs:300, src/app/main/ui/workspace/sidebar.cljs:275, src/app/main/ui/workspace/tokens/modals/themes.cljs:396, src/app/main/ui/workspace/tokens/modals.cljs:64
+#: src/app/main/ui/dashboard/comments.cljs:102, src/app/main/ui/dashboard/projects.cljs:99, src/app/main/ui/exports/files.cljs:210, src/app/main/ui/settings/access_tokens.cljs:171, src/app/main/ui/viewer/login.cljs:71, src/app/main/ui/viewer/share_link.cljs:175, src/app/main/ui/workspace/comments.cljs:128, src/app/main/ui/workspace/libraries.cljs:627, src/app/main/ui/workspace/sidebar/debug.cljs:40, src/app/main/ui/workspace/sidebar/layers.cljs:300, src/app/main/ui/workspace/sidebar.cljs:276, src/app/main/ui/workspace/tokens/modals/themes.cljs:59, src/app/main/ui/workspace/tokens/modals/themes.cljs:166, src/app/main/ui/workspace/tokens/modals/themes.cljs:446, src/app/main/ui/workspace/tokens/modals.cljs:64
msgid "labels.close"
msgstr "غلق"
-#: src/app/main/ui/viewer/comments.cljs:70, src/app/main/ui/workspace/comments.cljs:123
+#: src/app/main/ui/viewer/comments.cljs:71, src/app/main/ui/workspace/comments.cljs:126
msgid "labels.comments"
msgstr "تعليقات"
-#: src/app/main/ui/dashboard/sidebar.cljs:1016, src/app/main/ui/workspace/main_menu.cljs:114
+#: src/app/main/ui/dashboard/sidebar.cljs:1017, src/app/main/ui/workspace/main_menu.cljs:114
msgid "labels.community"
msgstr "مجتمع"
@@ -1297,7 +1294,7 @@ msgstr "مجتمع"
msgid "labels.confirm-password"
msgstr "تأكيد كلمة المرور"
-#: src/app/main/ui/dashboard/import.cljs:495, src/app/main/ui/exports/files.cljs:197, src/app/main/ui/onboarding/newsletter.cljs:101
+#: src/app/main/ui/dashboard/import.cljs:495, src/app/main/ui/exports/files.cljs:197, src/app/main/ui/onboarding/newsletter.cljs:106
msgid "labels.continue"
msgstr "استمر"
@@ -1309,7 +1306,7 @@ msgstr "تابع مع"
msgid "labels.continue-with-penpot"
msgstr "يمكنك المتابعة مع حساب Penpot"
-#: src/app/main/ui/workspace/sidebar/assets/groups.cljs:153, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:190
+#: src/app/main/ui/workspace/sidebar/assets/groups.cljs:153, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:197
msgid "labels.create"
msgstr "انشاء"
@@ -1329,15 +1326,15 @@ msgstr "خطوط مخصصة"
msgid "labels.dashboard"
msgstr "لوحة التحكم"
-#: src/app/main/ui/dashboard/file_menu.cljs:326, src/app/main/ui/dashboard/fonts.cljs:259, src/app/main/ui/dashboard/fonts.cljs:335, src/app/main/ui/dashboard/fonts.cljs:349, src/app/main/ui/dashboard/project_menu.cljs:115, src/app/main/ui/dashboard/team.cljs:952, src/app/main/ui/settings/access_tokens.cljs:198, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:209, src/app/main/ui/workspace/sidebar/versions.cljs:136, src/app/main/ui/workspace/tokens/form.cljs:500, src/app/main/ui/workspace/tokens/modals/themes.cljs:365, src/app/main/ui/workspace/tokens/sets_context_menu.cljs:52
+#: src/app/main/ui/dashboard/file_menu.cljs:326, src/app/main/ui/dashboard/fonts.cljs:261, src/app/main/ui/dashboard/fonts.cljs:337, src/app/main/ui/dashboard/fonts.cljs:351, src/app/main/ui/dashboard/project_menu.cljs:115, src/app/main/ui/dashboard/team.cljs:952, src/app/main/ui/settings/access_tokens.cljs:197, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:216, src/app/main/ui/workspace/sidebar/versions.cljs:136, src/app/main/ui/workspace/tokens/form.cljs:565, src/app/main/ui/workspace/tokens/modals/themes.cljs:414, src/app/main/ui/workspace/tokens/sets_context_menu.cljs:56
msgid "labels.delete"
msgstr "حذف"
-#: src/app/main/ui/comments.cljs:907
+#: src/app/main/ui/comments.cljs:976
msgid "labels.delete-comment"
msgstr "حذف التعليق"
-#: src/app/main/ui/comments.cljs:830
+#: src/app/main/ui/comments.cljs:899
msgid "labels.delete-comment-thread"
msgstr "حذف موضوع"
@@ -1349,11 +1346,11 @@ msgstr "حذف الدعوة"
msgid "labels.delete-multi-files"
msgstr "حذف %s ملفات"
-#: src/app/main/ui/dashboard/file_menu.cljs:29, src/app/main/ui/dashboard/files.cljs:79, src/app/main/ui/dashboard/files.cljs:177, src/app/main/ui/dashboard/projects.cljs:227, src/app/main/ui/dashboard/projects.cljs:231, src/app/main/ui/dashboard/sidebar.cljs:814
+#: src/app/main/ui/dashboard/file_menu.cljs:29, src/app/main/ui/dashboard/files.cljs:79, src/app/main/ui/dashboard/files.cljs:177, src/app/main/ui/dashboard/projects.cljs:228, src/app/main/ui/dashboard/projects.cljs:232, src/app/main/ui/dashboard/sidebar.cljs:814
msgid "labels.drafts"
msgstr "المسودات"
-#: src/app/main/ui/comments.cljs:903, src/app/main/ui/dashboard/fonts.cljs:256, src/app/main/ui/dashboard/team.cljs:950, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:205, src/app/main/ui/workspace/tokens/sidebar.cljs:198
+#: src/app/main/ui/comments.cljs:972, src/app/main/ui/dashboard/fonts.cljs:258, src/app/main/ui/dashboard/team.cljs:950, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:212, src/app/main/ui/workspace/tokens/sidebar.cljs:197
msgid "labels.edit"
msgstr "تعديل"
@@ -1369,7 +1366,7 @@ msgstr "محرر"
msgid "labels.expired-invitation"
msgstr "منتهي الصلاحية"
-#: src/app/main/ui/exports/assets.cljs:170, src/app/main/ui/workspace/tokens/sidebar.cljs:359
+#: src/app/main/ui/exports/assets.cljs:170, src/app/main/ui/workspace/tokens/sidebar.cljs:418
msgid "labels.export"
msgstr "استخراج"
@@ -1381,7 +1378,7 @@ msgstr "تعطيل الملاحظات"
msgid "labels.feedback-sent"
msgstr "تم إرسال الملاحظات"
-#: src/app/main/ui/dashboard/fonts.cljs:422
+#: src/app/main/ui/dashboard/fonts.cljs:424
msgid "labels.font-family"
msgstr "عائلة الخط"
@@ -1389,19 +1386,19 @@ msgstr "عائلة الخط"
msgid "labels.font-providers"
msgstr "موفري الخط"
-#: src/app/main/ui/dashboard/fonts.cljs:423
+#: src/app/main/ui/dashboard/fonts.cljs:425
msgid "labels.font-variants"
msgstr "الأنماط"
-#: src/app/main/ui/dashboard/fonts.cljs:54, src/app/main/ui/dashboard/sidebar.cljs:834
+#: src/app/main/ui/dashboard/fonts.cljs:55, src/app/main/ui/dashboard/sidebar.cljs:834
msgid "labels.fonts"
msgstr "الخطوط"
-#: src/app/main/ui/dashboard/sidebar.cljs:1046, src/app/main/ui/workspace/main_menu.cljs:146
+#: src/app/main/ui/dashboard/sidebar.cljs:1047, src/app/main/ui/workspace/main_menu.cljs:146
msgid "labels.github-repo"
msgstr "مستودع Github"
-#: src/app/main/ui/dashboard/sidebar.cljs:1063, src/app/main/ui/settings/sidebar.cljs:125, src/app/main/ui/workspace/main_menu.cljs:175
+#: src/app/main/ui/dashboard/sidebar.cljs:1064, src/app/main/ui/settings/sidebar.cljs:125, src/app/main/ui/workspace/main_menu.cljs:175
msgid "labels.give-feedback"
msgstr "إعطاء ملاحظات"
@@ -1409,15 +1406,15 @@ msgstr "إعطاء ملاحظات"
msgid "labels.go-back"
msgstr "الرجوع للخلف"
-#: src/app/main/ui/dashboard/sidebar.cljs:1009, src/app/main/ui/workspace/main_menu.cljs:106, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1079, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1104, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1290
+#: src/app/main/ui/dashboard/sidebar.cljs:1010, src/app/main/ui/workspace/main_menu.cljs:106, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1088, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1113, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1299
msgid "labels.help-center"
msgstr "مركز المساعدة"
-#: src/app/main/ui/viewer/comments.cljs:103, src/app/main/ui/workspace/comments.cljs:72
+#: src/app/main/ui/viewer/comments.cljs:104, src/app/main/ui/workspace/comments.cljs:73
msgid "labels.hide-resolved-comments"
msgstr "إخفاء التعليقات التي تم حلها"
-#: src/app/main/ui/dashboard/fonts.cljs:420
+#: src/app/main/ui/dashboard/fonts.cljs:422
msgid "labels.installed-fonts"
msgstr "الخطوط المتوفرة"
@@ -1437,7 +1434,7 @@ msgstr "الدعوات"
msgid "labels.language"
msgstr "اللغة"
-#: src/app/main/ui/dashboard/sidebar.cljs:1039, src/app/main/ui/workspace/main_menu.cljs:138
+#: src/app/main/ui/dashboard/sidebar.cljs:1040, src/app/main/ui/workspace/main_menu.cljs:138
msgid "labels.libraries-and-templates"
msgstr "المكتبات والقوالب"
@@ -1445,7 +1442,7 @@ msgstr "المكتبات والقوالب"
msgid "labels.log-or-sign"
msgstr "تسجيل الدخول أو الاشتراك"
-#: src/app/main/ui/dashboard/sidebar.cljs:1071
+#: src/app/main/ui/dashboard/sidebar.cljs:1072
msgid "labels.logout"
msgstr "تسجيل خروج"
@@ -1461,7 +1458,7 @@ msgstr "الأعضاء"
msgid "labels.new-password"
msgstr "كلمة مرور جديدة"
-#: src/app/main/ui/dashboard/comments.cljs:106, src/app/main/ui/workspace/comments.cljs:161
+#: src/app/main/ui/dashboard/comments.cljs:121, src/app/main/ui/workspace/comments.cljs:164
msgid "labels.no-comments-available"
msgstr "ليس لديك أي إشعارات تعليق معلقة"
@@ -1483,7 +1480,7 @@ msgstr "قد لا تكون هذه الصفحة موجودة أو ليس لديك
msgid "labels.not-found.main-message"
msgstr "عفواً!"
-#: src/app/main/ui/dashboard/projects.cljs:238, src/app/main/ui/dashboard/team.cljs:1147
+#: src/app/main/ui/dashboard/projects.cljs:239, src/app/main/ui/dashboard/team.cljs:1147
msgid "labels.num-of-files"
msgid_plural "labels.num-of-files"
msgstr[0] "0 ملف"
@@ -1546,7 +1543,7 @@ msgstr "الملف الشخصي"
msgid "labels.projects"
msgstr "المشاريع"
-#: src/app/main/ui/dashboard/sidebar.cljs:1029, src/app/main/ui/settings/sidebar.cljs:118, src/app/main/ui/workspace/main_menu.cljs:130
+#: src/app/main/ui/dashboard/sidebar.cljs:1030, src/app/main/ui/settings/sidebar.cljs:118, src/app/main/ui/workspace/main_menu.cljs:130
msgid "labels.release-notes"
msgstr "ملاحظات الإصدار"
@@ -1559,7 +1556,7 @@ msgstr "إزالة"
msgid "labels.remove-member"
msgstr "إزالة العضو"
-#: src/app/main/ui/dashboard/file_menu.cljs:278, src/app/main/ui/dashboard/project_menu.cljs:88, src/app/main/ui/dashboard/sidebar.cljs:548, src/app/main/ui/workspace/sidebar/assets/groups.cljs:153, src/app/main/ui/workspace/sidebar/versions.cljs:130, src/app/main/ui/workspace/tokens/sets_context_menu.cljs:51
+#: src/app/main/ui/dashboard/file_menu.cljs:278, src/app/main/ui/dashboard/project_menu.cljs:88, src/app/main/ui/dashboard/sidebar.cljs:548, src/app/main/ui/workspace/sidebar/assets/groups.cljs:153, src/app/main/ui/workspace/sidebar/versions.cljs:130, src/app/main/ui/workspace/tokens/sets_context_menu.cljs:55
msgid "labels.rename"
msgstr "اعاده تسميه"
@@ -1579,11 +1576,11 @@ msgstr "أعد المحاولة"
msgid "labels.role"
msgstr "دور"
-#: src/app/main/ui/dashboard/fonts.cljs:385, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:191, src/app/main/ui/workspace/tokens/form.cljs:510
+#: src/app/main/ui/dashboard/fonts.cljs:387, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:198, src/app/main/ui/workspace/tokens/form.cljs:577
msgid "labels.save"
msgstr "حفظ"
-#: src/app/main/ui/dashboard/fonts.cljs:425
+#: src/app/main/ui/dashboard/fonts.cljs:427
msgid "labels.search-font"
msgstr "البحث عن الخط"
@@ -1615,15 +1612,15 @@ msgstr "مشاركة النموذج الأولي"
msgid "labels.shared-libraries"
msgstr "المكتبات المشتركة"
-#: src/app/main/ui/viewer/comments.cljs:82, src/app/main/ui/workspace/comments.cljs:54, src/app/main/ui/workspace/comments.cljs:134
+#: src/app/main/ui/viewer/comments.cljs:83, src/app/main/ui/workspace/comments.cljs:55, src/app/main/ui/workspace/comments.cljs:137
msgid "labels.show-all-comments"
msgstr "إظهار كافة التعليقات"
-#: src/app/main/ui/viewer/comments.cljs:115
+#: src/app/main/ui/viewer/comments.cljs:116
msgid "labels.show-comments-list"
msgstr "قائمة التعليقات"
-#: src/app/main/ui/viewer/comments.cljs:91, src/app/main/ui/workspace/comments.cljs:60, src/app/main/ui/workspace/comments.cljs:135
+#: src/app/main/ui/viewer/comments.cljs:92, src/app/main/ui/workspace/comments.cljs:61, src/app/main/ui/workspace/comments.cljs:138
msgid "labels.show-your-comments"
msgstr "إظهار تعليقاتك فقط"
@@ -1631,7 +1628,7 @@ msgstr "إظهار تعليقاتك فقط"
msgid "labels.status"
msgstr "الحالة"
-#: src/app/main/ui/dashboard/sidebar.cljs:1023, src/app/main/ui/workspace/main_menu.cljs:122
+#: src/app/main/ui/dashboard/sidebar.cljs:1024, src/app/main/ui/workspace/main_menu.cljs:122
msgid "labels.tutorials"
msgstr "الدروس"
@@ -1643,15 +1640,15 @@ msgstr "تحديث"
msgid "labels.update-team"
msgstr "تحديث الفريق"
-#: src/app/main/ui/dashboard/fonts.cljs:245
+#: src/app/main/ui/dashboard/fonts.cljs:247
msgid "labels.upload"
msgstr "رفع"
-#: src/app/main/ui/dashboard/fonts.cljs:173
+#: src/app/main/ui/dashboard/fonts.cljs:174
msgid "labels.upload-custom-fonts"
msgstr "تحميل الخطوط المخصصة"
-#: src/app/main/ui/dashboard/fonts.cljs:244
+#: src/app/main/ui/dashboard/fonts.cljs:246
msgid "labels.uploading"
msgstr "جارٍ الرفع …"
@@ -1659,7 +1656,7 @@ msgstr "جارٍ الرفع …"
msgid "labels.viewer"
msgstr "مشاهد"
-#: src/app/main/ui/comments.cljs:743
+#: src/app/main/ui/comments.cljs:818
msgid "labels.write-new-comment"
msgstr "كتابة تعليق جديد"
@@ -1667,7 +1664,7 @@ msgstr "كتابة تعليق جديد"
msgid "labels.you"
msgstr "(أنت)"
-#: src/app/main/ui/dashboard/sidebar.cljs:999
+#: src/app/main/ui/dashboard/sidebar.cljs:1000
msgid "labels.your-account"
msgstr "حسابك"
@@ -1729,17 +1726,17 @@ msgstr "بحذف حسابك، ستفقد جميع مشاريعك وأرشيفا
msgid "modals.delete-account.title"
msgstr "هل انت متأكد انك تريد حذف حسابك؟"
-#: src/app/main/ui/comments.cljs:800
+#: src/app/main/ui/comments.cljs:869
msgid "modals.delete-comment-thread.accept"
msgstr "حذف المحادثة"
-#: src/app/main/ui/comments.cljs:799
+#: src/app/main/ui/comments.cljs:868
msgid "modals.delete-comment-thread.message"
msgstr ""
"هل أنت متأكد أنك تريد حذف هذه المحادثة؟ سيتم حذف جميع التعليقات في هذا "
"الموضوع."
-#: src/app/main/ui/comments.cljs:798
+#: src/app/main/ui/comments.cljs:867
msgid "modals.delete-comment-thread.title"
msgstr "حذف المحادثة"
@@ -1767,29 +1764,29 @@ msgstr "هل تريد بالتأكيد حذف %s من الملفات؟"
msgid "modals.delete-file-multi-confirm.title"
msgstr "حذف %s الملفات"
-#: src/app/main/ui/dashboard/fonts.cljs:348
+#: src/app/main/ui/dashboard/fonts.cljs:350
msgid "modals.delete-font-variant.message"
msgstr ""
"هل أنت متأكد أنك تريد حذف نمط هذا الخط؟ لن يتم تحميله إذا تم استخدامه في "
"ملف."
-#: src/app/main/ui/dashboard/fonts.cljs:347
+#: src/app/main/ui/dashboard/fonts.cljs:349
msgid "modals.delete-font-variant.title"
msgstr "حذف نمط الخط"
-#: src/app/main/ui/dashboard/fonts.cljs:334
+#: src/app/main/ui/dashboard/fonts.cljs:336
msgid "modals.delete-font.message"
msgstr "هل أنت متأكد أنك تريد حذف هذا الخط؟ لن يتم تحميله إذا تم استخدامه في ملف."
-#: src/app/main/ui/dashboard/fonts.cljs:333
+#: src/app/main/ui/dashboard/fonts.cljs:335
msgid "modals.delete-font.title"
msgstr "حذف الخط"
-#: src/app/main/ui/workspace/context_menu.cljs:627, src/app/main/ui/workspace/sidebar/sitemap.cljs:71
+#: src/app/main/ui/workspace/context_menu.cljs:643, src/app/main/ui/workspace/sidebar/sitemap.cljs:71
msgid "modals.delete-page.body"
msgstr "هل أنت متأكد أنك تريد حذف هذه الصفحة؟"
-#: src/app/main/ui/workspace/context_menu.cljs:626, src/app/main/ui/workspace/sidebar/sitemap.cljs:70
+#: src/app/main/ui/workspace/context_menu.cljs:642, src/app/main/ui/workspace/sidebar/sitemap.cljs:70
msgid "modals.delete-page.title"
msgstr "حذف الصفحة"
@@ -1944,21 +1941,21 @@ msgstr ""
msgid "modals.update-remote-component-in-bulk.message"
msgstr "تحديث المكونات في مكتبة مشتركة"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:393
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:403
msgid "modals.update-remote-component.accept"
msgstr "تحديث المكون"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:392
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:402
msgid "modals.update-remote-component.cancel"
msgstr "إلغاﺀ"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:391
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:401
msgid "modals.update-remote-component.hint"
msgstr ""
"أنت على وشك تحديث مكون في مكتبة مشتركة. قد يؤثر هذا على الملفات الأخرى التي "
"تستخدمها."
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:390
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:400
msgid "modals.update-remote-component.message"
msgstr "تحديث المكون في المكتبة المشتركة"
@@ -2060,15 +2057,15 @@ msgstr "دعوة مع الدور:"
msgid "onboarding.newsletter.accept"
msgstr "نعم ، اشترك"
-#: src/app/main/ui/onboarding/newsletter.cljs:40
+#: src/app/main/ui/onboarding/newsletter.cljs:42
msgid "onboarding.newsletter.acceptance-message"
msgstr "تم إرسال طلب الاشتراك الخاص بك ، وسوف نرسل لك بريدًا إلكترونيًا لتأكيده."
-#: src/app/main/ui/onboarding/newsletter.cljs:95
+#: src/app/main/ui/onboarding/newsletter.cljs:100
msgid "onboarding.newsletter.policy"
msgstr "سياسة الخصوصية."
-#: src/app/main/ui/onboarding/newsletter.cljs:60
+#: src/app/main/ui/onboarding/newsletter.cljs:65
msgid "onboarding.newsletter.title"
msgstr "هل تريد تلقي أخبار Penpot؟"
@@ -2118,7 +2115,7 @@ msgstr "Penpotأهلا بك في"
msgid "profile.recovery.go-to-login"
msgstr "اذهب إلى تسجيل الدخول"
-#: src/app/main/ui/viewer/inspect/exports.cljs:147, src/app/main/ui/workspace/sidebar/options/menus/border_radius.cljs:90, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:622, src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs:137, src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs:148, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:196, src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:162, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:355, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:366, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:386, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:397, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:413, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:315, src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs:182, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:380, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:397, src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs:247, src/app/main/ui/workspace/sidebar/options/rows/stroke_row.cljs:172
+#: src/app/main/ui/inspect/exports.cljs:148, src/app/main/ui/workspace/sidebar/options/menus/border_radius.cljs:90, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:712, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:831, src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs:137, src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs:148, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:197, src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:162, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:342, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:357, src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:53, src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:54, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:352, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:363, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:383, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:394, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:410, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:302, src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs:182, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:383, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:400, src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs:247, src/app/main/ui/workspace/sidebar/options/rows/stroke_row.cljs:173
msgid "settings.multiple"
msgstr "مكرر"
@@ -2288,7 +2285,7 @@ msgstr "أضف جديد"
msgid "shortcuts.cut"
msgstr "إقطع"
-#: src/app/main/ui/workspace/right_header.cljs:116, src/app/main/ui/workspace/sidebar/shortcuts.cljs:98
+#: src/app/main/ui/workspace/right_header.cljs:84, src/app/main/ui/workspace/sidebar/shortcuts.cljs:98
msgid "shortcuts.decrease-zoom"
msgstr "تصغير"
@@ -2380,7 +2377,7 @@ msgstr "وزع أفقيًا"
msgid "shortcuts.hide-ui"
msgstr "إظهار / إخفاء واجهة المستخدم"
-#: src/app/main/ui/workspace/right_header.cljs:121, src/app/main/ui/workspace/sidebar/shortcuts.cljs:123
+#: src/app/main/ui/workspace/right_header.cljs:89, src/app/main/ui/workspace/sidebar/shortcuts.cljs:123
msgid "shortcuts.increase-zoom"
msgstr "تكبير"
@@ -2568,15 +2565,15 @@ msgstr "كبر المحدد"
msgid "title.dashboard.files"
msgstr "%s - Penpotعنوان ملفات لوحة القيادة"
-#: src/app/main/ui/dashboard/fonts.cljs:39
+#: src/app/main/ui/dashboard/fonts.cljs:40
msgid "title.dashboard.font-providers"
msgstr "مزودي أسلوب الخط - %s - Penpot"
-#: src/app/main/ui/dashboard/fonts.cljs:38
+#: src/app/main/ui/dashboard/fonts.cljs:39
msgid "title.dashboard.fonts"
msgstr "أسلوب خط لوحة القيادة - %s - Penpot"
-#: src/app/main/ui/dashboard/projects.cljs:347
+#: src/app/main/ui/dashboard/projects.cljs:350
msgid "title.dashboard.projects"
msgstr "برامج ملفات القيادة - %s - Penpot"
@@ -2584,7 +2581,7 @@ msgstr "برامج ملفات القيادة - %s - Penpot"
msgid "title.dashboard.search"
msgstr "البحث - %s - Penpot"
-#: src/app/main/ui/dashboard/libraries.cljs:42
+#: src/app/main/ui/dashboard/libraries.cljs:57
msgid "title.dashboard.shared-libraries"
msgstr "المكاتب المقسمة - %s - Penpot"
@@ -2592,7 +2589,7 @@ msgstr "المكاتب المقسمة - %s - Penpot"
msgid "title.default"
msgstr "Penpot - صمم حرية الفرق"
-#: src/app/main/ui/settings/access_tokens.cljs:281
+#: src/app/main/ui/settings/access_tokens.cljs:280
msgid "title.settings.access-tokens"
msgstr "رموز الوصول للحساب"
@@ -2632,7 +2629,7 @@ msgstr "خطافات الويب - %s - Penpot"
msgid "title.viewer"
msgstr "%s -أسلوب العرض - Penpot"
-#: src/app/main/ui/workspace.cljs:202
+#: src/app/main/ui/workspace.cljs:188
msgid "title.workspace"
msgstr "%s -مساحة العمل Penpot"
@@ -2738,15 +2735,15 @@ msgstr "محاذاة أعلى (%s)"
msgid "workspace.assets.assets"
msgstr "أصول"
-#: src/app/main/ui/workspace/sidebar/assets.cljs:146
+#: src/app/main/ui/workspace/sidebar/assets.cljs:144
msgid "workspace.assets.box-filter-all"
msgstr "كل الأصول"
-#: src/app/main/ui/dashboard/grid.cljs:147, src/app/main/ui/dashboard/grid.cljs:179, src/app/main/ui/workspace/sidebar/assets/colors.cljs:486, src/app/main/ui/workspace/sidebar/assets.cljs:158
+#: src/app/main/ui/dashboard/grid.cljs:148, src/app/main/ui/dashboard/grid.cljs:180, src/app/main/ui/workspace/sidebar/assets/colors.cljs:486, src/app/main/ui/workspace/sidebar/assets.cljs:156
msgid "workspace.assets.colors"
msgstr "الألوان"
-#: src/app/main/ui/dashboard/grid.cljs:143, src/app/main/ui/dashboard/grid.cljs:158, src/app/main/ui/workspace/sidebar/assets/components.cljs:489, src/app/main/ui/workspace/sidebar/assets.cljs:149
+#: src/app/main/ui/dashboard/grid.cljs:144, src/app/main/ui/dashboard/grid.cljs:159, src/app/main/ui/workspace/sidebar/assets/components.cljs:499, src/app/main/ui/workspace/sidebar/assets.cljs:147
msgid "workspace.assets.components"
msgstr "عناصر"
@@ -2758,15 +2755,15 @@ msgstr "إيجاد مجموعة"
msgid "workspace.assets.create-group-hint"
msgstr "\"ستسمى عناصرك تلقائيا ك\"اسم مجموعة\" \"اسم عنصر"
-#: src/app/main/ui/workspace/context_menu.cljs:636, src/app/main/ui/workspace/sidebar/assets/colors.cljs:250, src/app/main/ui/workspace/sidebar/assets/components.cljs:554, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:426, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:442
+#: src/app/main/ui/workspace/context_menu.cljs:652, src/app/main/ui/workspace/sidebar/assets/colors.cljs:250, src/app/main/ui/workspace/sidebar/assets/components.cljs:564, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:426, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:442
msgid "workspace.assets.delete"
msgstr "امسح"
-#: src/app/main/ui/workspace/context_menu.cljs:641, src/app/main/ui/workspace/sidebar/assets/components.cljs:549
+#: src/app/main/ui/workspace/context_menu.cljs:657, src/app/main/ui/workspace/sidebar/assets/components.cljs:559
msgid "workspace.assets.duplicate"
msgstr "انسخ"
-#: src/app/main/ui/workspace/sidebar/assets/components.cljs:548
+#: src/app/main/ui/workspace/sidebar/assets/components.cljs:558
msgid "workspace.assets.duplicate-main"
msgstr "انسخ الأصل"
@@ -2774,11 +2771,11 @@ msgstr "انسخ الأصل"
msgid "workspace.assets.edit"
msgstr "التحرير"
-#: src/app/main/ui/workspace/sidebar/assets/graphics.cljs:386, src/app/main/ui/workspace/sidebar/assets.cljs:154
+#: src/app/main/ui/workspace/sidebar/assets/graphics.cljs:386, src/app/main/ui/workspace/sidebar/assets.cljs:152
msgid "workspace.assets.graphics"
msgstr "رسومات"
-#: src/app/main/ui/workspace/sidebar/assets/colors.cljs:254, src/app/main/ui/workspace/sidebar/assets/components.cljs:558, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:430, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:447
+#: src/app/main/ui/workspace/sidebar/assets/colors.cljs:254, src/app/main/ui/workspace/sidebar/assets/components.cljs:568, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:430, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:447
msgid "workspace.assets.group"
msgstr "مجموعة"
@@ -2786,23 +2783,19 @@ msgstr "مجموعة"
msgid "workspace.assets.group-name"
msgstr "اسم المجموعة"
-#: src/app/main/ui/workspace/sidebar/assets.cljs:186
-msgid "workspace.assets.libraries"
-msgstr "المكتبات"
-
-#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:106, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:336
+#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:107, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:417
msgid "workspace.assets.local-library"
msgstr "المكتبة المحلية"
-#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:320
+#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:321
msgid "workspace.assets.not-found"
msgstr "الأصل غير موجود"
-#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:111
+#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:112
msgid "workspace.assets.open-library"
msgstr "افتح ملف المكتب"
-#: src/app/main/ui/workspace/context_menu.cljs:639, src/app/main/ui/workspace/sidebar/assets/colors.cljs:242, src/app/main/ui/workspace/sidebar/assets/components.cljs:543, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:423, src/app/main/ui/workspace/sidebar/assets/groups.cljs:62, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:433
+#: src/app/main/ui/workspace/context_menu.cljs:655, src/app/main/ui/workspace/sidebar/assets/colors.cljs:242, src/app/main/ui/workspace/sidebar/assets/components.cljs:553, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:423, src/app/main/ui/workspace/sidebar/assets/groups.cljs:62, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:433
msgid "workspace.assets.rename"
msgstr "إعادة تسمية"
@@ -2810,7 +2803,7 @@ msgstr "إعادة تسمية"
msgid "workspace.assets.rename-group"
msgstr "إعادة تسمية المجموعة"
-#: src/app/main/ui/workspace/sidebar/assets.cljs:192
+#: src/app/main/ui/workspace/sidebar/assets.cljs:182
msgid "workspace.assets.search"
msgstr "الخث عن أصل"
@@ -2830,7 +2823,7 @@ msgstr[5] ""
msgid "workspace.assets.shared-library"
msgstr "مكتبة مشتركة"
-#: src/app/main/ui/dashboard/grid.cljs:151, src/app/main/ui/dashboard/grid.cljs:206, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:396, src/app/main/ui/workspace/sidebar/assets.cljs:162
+#: src/app/main/ui/dashboard/grid.cljs:152, src/app/main/ui/dashboard/grid.cljs:207, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:396, src/app/main/ui/workspace/sidebar/assets.cljs:160
msgid "workspace.assets.typography"
msgstr "الطباعة"
@@ -2839,27 +2832,27 @@ msgstr "الطباعة"
msgid "workspace.assets.typography.font-id"
msgstr "أسلوب الخط"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:517
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:520
msgid "workspace.assets.typography.font-size"
msgstr "الحجم"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:513
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:516
msgid "workspace.assets.typography.font-variant-id"
msgstr "البديل"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:535
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:538
msgid "workspace.assets.typography.go-to-edit"
msgstr "اذهب إلى تحرير نوع ملف المكتبة"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:525
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:528
msgid "workspace.assets.typography.letter-spacing"
msgstr "تباعد الحروف"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:521
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:524
msgid "workspace.assets.typography.line-height"
msgstr "طول الخط"
-#: src/app/main/ui/dashboard/grid.cljs:216, src/app/main/ui/workspace/libraries.cljs:562, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:476, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:501, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:608, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:627
+#: src/app/main/ui/dashboard/grid.cljs:217, src/app/main/ui/workspace/libraries.cljs:546, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:479, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:504, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:611, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:630
msgid "workspace.assets.typography.sample"
msgstr "أسلوب خط النص"
@@ -2867,7 +2860,7 @@ msgstr "أسلوب خط النص"
msgid "workspace.assets.typography.text-styles"
msgstr "أسلوب خط النص"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:529
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:532
msgid "workspace.assets.typography.text-transform"
msgstr "تحويل النص"
@@ -2879,11 +2872,11 @@ msgstr "فك التجميع"
msgid "workspace.focus.focus-mode"
msgstr "وضع التركيز"
-#: src/app/main/ui/workspace/context_menu.cljs:378, src/app/main/ui/workspace/context_menu.cljs:663
+#: src/app/main/ui/workspace/context_menu.cljs:380, src/app/main/ui/workspace/context_menu.cljs:679
msgid "workspace.focus.focus-off"
msgstr "تعطيل التركيز"
-#: src/app/main/ui/workspace/context_menu.cljs:377
+#: src/app/main/ui/workspace/context_menu.cljs:379
msgid "workspace.focus.focus-on"
msgstr "تشغيل التركيز"
@@ -3013,33 +3006,32 @@ msgstr "أظهر لوخة أسلوب الخط"
msgid "workspace.header.menu.undo"
msgstr "الإلغاء"
-#: src/app/main/ui/viewer/header.cljs:98, src/app/main/ui/workspace/right_header.cljs:126
+#: src/app/main/ui/viewer/header.cljs:98, src/app/main/ui/workspace/right_header.cljs:94
msgid "workspace.header.reset-zoom"
msgstr "إعادة ضبط"
-#: src/app/main/ui/workspace/header.cljs
-#, unused
+#: src/app/main/ui/workspace/left_header.cljs:127
msgid "workspace.header.save-error"
msgstr "خطأ في حفظ الملف"
-#: src/app/main/ui/workspace/right_header.cljs:58
+#: src/app/main/ui/workspace/left_header.cljs:126
msgid "workspace.header.saved"
msgstr "تم الحفظ"
-#: src/app/main/ui/workspace/header.cljs
-#, unused
+#: src/app/main/ui/workspace/left_header.cljs:124, src/app/main/ui/workspace/left_header.cljs:125
msgid "workspace.header.saving"
msgstr "حفظ الملف"
#: src/app/main/ui/workspace/right_header.cljs:48, src/app/main/ui/workspace/right_header.cljs:53
+#, unused
msgid "workspace.header.unsaved"
msgstr "تغييرات غير محفوظة"
-#: src/app/main/ui/workspace/right_header.cljs:260
+#: src/app/main/ui/workspace/right_header.cljs:226
msgid "workspace.header.viewer"
msgstr "وضع العرض (%s)"
-#: src/app/main/ui/viewer/header.cljs:79, src/app/main/ui/workspace/right_header.cljs:109
+#: src/app/main/ui/viewer/header.cljs:79, src/app/main/ui/workspace/right_header.cljs:77
msgid "workspace.header.zoom"
msgstr "تكبير"
@@ -3051,7 +3043,7 @@ msgstr "مقياس الملأ"
msgid "workspace.header.zoom-fit"
msgstr "تقليص المقياس للتناسب"
-#: src/app/main/ui/workspace/right_header.cljs:129
+#: src/app/main/ui/workspace/right_header.cljs:97
msgid "workspace.header.zoom-fit-all"
msgstr "التكبير لتناسب الجميع"
@@ -3059,7 +3051,7 @@ msgstr "التكبير لتناسب الجميع"
msgid "workspace.header.zoom-full-screen"
msgstr "تكبير الشاشة"
-#: src/app/main/ui/workspace/right_header.cljs:136
+#: src/app/main/ui/workspace/right_header.cljs:104
msgid "workspace.header.zoom-selected"
msgstr "تكبير"
@@ -3072,7 +3064,7 @@ msgstr "تحرير التشبيك"
msgid "workspace.libraries.add"
msgstr "الإضافة"
-#: src/app/main/ui/workspace/libraries.cljs:107, src/app/main/ui/workspace/libraries.cljs:133
+#: src/app/main/ui/workspace/libraries.cljs:106, src/app/main/ui/workspace/libraries.cljs:132
msgid "workspace.libraries.colors"
msgstr "%s الألوان"
@@ -3102,31 +3094,31 @@ msgstr "الألوان المؤخرة"
msgid "workspace.libraries.colors.rgb-complementary"
msgstr "RGB مكملات"
-#: src/app/main/ui/workspace/colorpicker.cljs:344
+#: src/app/main/ui/workspace/colorpicker.cljs:340
msgid "workspace.libraries.colors.rgba"
msgstr "RGBA"
-#: src/app/main/ui/workspace/colorpicker.cljs:515
+#: src/app/main/ui/workspace/colorpicker.cljs:511
msgid "workspace.libraries.colors.save-color"
msgstr "حفظ أسلوب اللون"
-#: src/app/main/ui/workspace/libraries.cljs:101, src/app/main/ui/workspace/libraries.cljs:125
+#: src/app/main/ui/workspace/libraries.cljs:100, src/app/main/ui/workspace/libraries.cljs:124
msgid "workspace.libraries.components"
msgstr "%s العناصر"
-#: src/app/main/ui/workspace/libraries.cljs:300
+#: src/app/main/ui/workspace/libraries.cljs:297
msgid "workspace.libraries.file-library"
msgstr "مكتبة الملف"
-#: src/app/main/ui/workspace/libraries.cljs:104, src/app/main/ui/workspace/libraries.cljs:129
+#: src/app/main/ui/workspace/libraries.cljs:103, src/app/main/ui/workspace/libraries.cljs:128
msgid "workspace.libraries.graphics"
msgstr "%s الرسومات"
-#: src/app/main/ui/workspace/libraries.cljs:294
+#: src/app/main/ui/workspace/libraries.cljs:291
msgid "workspace.libraries.in-this-file"
msgstr "المكتبات في هذا الملف"
-#: src/app/main/ui/workspace/libraries.cljs:629, src/app/main/ui/workspace/libraries.cljs:649
+#: src/app/main/ui/workspace/libraries.cljs:611, src/app/main/ui/workspace/libraries.cljs:631
msgid "workspace.libraries.libraries"
msgstr "المكتبات"
@@ -3135,51 +3127,47 @@ msgstr "المكتبات"
msgid "workspace.libraries.library"
msgstr "المكتبة"
-#: src/app/main/ui/workspace/libraries.cljs:483
+#: src/app/main/ui/workspace/libraries.cljs:467
msgid "workspace.libraries.library-updates"
msgstr "تحديث المكتبة"
-#: src/app/main/ui/workspace/libraries.cljs:481
+#: src/app/main/ui/workspace/libraries.cljs:465
msgid "workspace.libraries.no-libraries-need-sync"
msgstr "لا يوجد مكتبات مشتركة تحتاج إلى تحديث"
-#: src/app/main/ui/workspace/libraries.cljs:394
+#: src/app/main/ui/workspace/libraries.cljs:378
msgid "workspace.libraries.no-matches-for"
msgstr "لا يوجد ما يطابق هذا “%s“"
-#: src/app/main/ui/workspace/libraries.cljs:384
-msgid "workspace.libraries.no-shared-libraries-available"
-msgstr "لا يوجد مكتبات مشتركة"
-
-#: src/app/main/ui/workspace/libraries.cljs:337
+#: src/app/main/ui/workspace/libraries.cljs:334
msgid "workspace.libraries.search-shared-libraries"
msgstr "البحث في المكتبات المشتركة"
-#: src/app/main/ui/workspace/libraries.cljs:333
+#: src/app/main/ui/workspace/libraries.cljs:330
msgid "workspace.libraries.shared-libraries"
msgstr "مكتبات مشتركة"
-#: src/app/main/ui/workspace/sidebar/options/menus/text.cljs:311
+#: src/app/main/ui/workspace/sidebar/options/menus/text.cljs:309
msgid "workspace.libraries.text.multiple-typography"
msgstr "كتابات عديدة"
-#: src/app/main/ui/workspace/sidebar/options/menus/text.cljs:314
+#: src/app/main/ui/workspace/sidebar/options/menus/text.cljs:312
msgid "workspace.libraries.text.multiple-typography-tooltip"
msgstr "إلغاء روابط كل الكتابات"
-#: src/app/main/ui/workspace/libraries.cljs:110, src/app/main/ui/workspace/libraries.cljs:137
+#: src/app/main/ui/workspace/libraries.cljs:109, src/app/main/ui/workspace/libraries.cljs:136
msgid "workspace.libraries.typography"
msgstr "%s الكتابات"
-#: src/app/main/ui/workspace/libraries.cljs:503
+#: src/app/main/ui/workspace/libraries.cljs:487
msgid "workspace.libraries.update"
msgstr "التحديث"
-#: src/app/main/ui/workspace/libraries.cljs:579
+#: src/app/main/ui/workspace/libraries.cljs:563
msgid "workspace.libraries.update.see-all-changes"
msgstr "رؤية جميع التغييرات"
-#: src/app/main/ui/workspace/libraries.cljs:632
+#: src/app/main/ui/workspace/libraries.cljs:614
msgid "workspace.libraries.updates"
msgstr "التحديثات"
@@ -3199,35 +3187,35 @@ msgstr "تطميس المجموعة"
msgid "workspace.options.blur-options.title.multiple"
msgstr "تطميس المحدد"
-#: src/app/main/ui/workspace/sidebar/options/page.cljs:38, src/app/main/ui/workspace/sidebar/options/page.cljs:45
+#: src/app/main/ui/workspace/sidebar/options/page.cljs:42, src/app/main/ui/workspace/sidebar/options/page.cljs:50
msgid "workspace.options.canvas-background"
msgstr "خلفية اللوحة القماشية"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:431
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:428
msgid "workspace.options.clip-content"
msgstr "محتوى المقطع"
-#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:590, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:595
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:678, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:683, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:812
msgid "workspace.options.component"
msgstr "العنصر"
-#: src/app/main/ui/viewer/inspect/annotation.cljs:19, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:181
+#: src/app/main/ui/inspect/annotation.cljs:19, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:188
msgid "workspace.options.component.annotation"
msgstr "حاشية"
-#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:600
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:688
msgid "workspace.options.component.copy"
msgstr "النسخ"
-#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:173
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:180
msgid "workspace.options.component.create-annotation"
msgstr "إنشاء حاشية"
-#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:172
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:179
msgid "workspace.options.component.edit-annotation"
msgstr "تحرير حاشية"
-#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:599
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:687, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:815
msgid "workspace.options.component.main"
msgstr "أصل"
@@ -3275,7 +3263,7 @@ msgstr "أعلى و أسفل"
msgid "workspace.options.design"
msgstr "تصميم"
-#: src/app/main/ui/viewer/inspect/exports.cljs:139
+#: src/app/main/ui/inspect/exports.cljs:140
msgid "workspace.options.export"
msgstr "تصدير"
@@ -3284,7 +3272,7 @@ msgstr "تصدير"
msgid "workspace.options.export-multiple"
msgstr "تحديد المصدر"
-#: src/app/main/ui/viewer/inspect/exports.cljs:178, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:228
+#: src/app/main/ui/inspect/exports.cljs:179, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:229
msgid "workspace.options.export.suffix"
msgstr "لاحقة"
@@ -3292,7 +3280,7 @@ msgstr "لاحقة"
msgid "workspace.options.exporting-complete"
msgstr "تم التصدير"
-#: src/app/main/ui/exports/assets.cljs:169, src/app/main/ui/exports/assets.cljs:240, src/app/main/ui/viewer/inspect/exports.cljs:194, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:247
+#: src/app/main/ui/exports/assets.cljs:169, src/app/main/ui/exports/assets.cljs:240, src/app/main/ui/inspect/exports.cljs:195, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:248
msgid "workspace.options.exporting-object"
msgstr "جاري التصدير…"
@@ -3422,7 +3410,7 @@ msgstr "ملأ المجموعة"
msgid "workspace.options.group-stroke"
msgstr "ضرب المجموعة"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:362
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:359
msgid "workspace.options.height"
msgstr "طول"
@@ -3732,19 +3720,19 @@ msgstr "الطبقات المحددة"
msgid "workspace.options.layout-item.advanced-ops"
msgstr "خيارات متقدمة"
-#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:561
+#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:563
msgid "workspace.options.layout-item.layout-item-max-h"
msgstr "أقصى ارتفاع"
-#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:528
+#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:530
msgid "workspace.options.layout-item.layout-item-max-w"
msgstr "أقصى عرض"
-#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:545
+#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:547
msgid "workspace.options.layout-item.layout-item-min-h"
msgstr "الحد الأدنو للارتفاع"
-#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:512
+#: src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:514
msgid "workspace.options.layout-item.layout-item-min-w"
msgstr "الحد الأدنى للعرض"
@@ -3858,11 +3846,11 @@ msgstr "التباعد بين"
msgid "workspace.options.layout.top"
msgstr "أعلى"
-#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:171
+#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:157
msgid "workspace.options.more-colors"
msgstr "المزيد من الألوان"
-#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:155
+#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:141
msgid "workspace.options.more-lib-colors"
msgstr "المزيد من ألوان المكتبة"
@@ -3899,7 +3887,7 @@ msgstr "أعلى الشمال"
msgid "workspace.options.radius-top-right"
msgstr "أعلى اليمين"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:186
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:189
msgid "workspace.options.recent-fonts"
msgstr "مؤخر"
@@ -3907,11 +3895,11 @@ msgstr "مؤخر"
msgid "workspace.options.retry"
msgstr "أعد المحاولة"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:406
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:403
msgid "workspace.options.rotation"
msgstr "دوران"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:183
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:186
msgid "workspace.options.search-font"
msgstr "البخث عن نوع الخط"
@@ -3919,7 +3907,7 @@ msgstr "البخث عن نوع الخط"
msgid "workspace.options.select-a-shape"
msgstr "اختر الشكل أو اللوحة لجر الإتصال الى لوحة أو شكل آخر"
-#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:128
+#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:114
msgid "workspace.options.selection-color"
msgstr "الألوان المختارة"
@@ -3931,43 +3919,43 @@ msgstr "اختر نوع الملأ"
msgid "workspace.options.selection-stroke"
msgstr "ضرب الإختيار"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:40, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:202, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:204
+#: src/app/main/ui/inspect/attributes/shadow.cljs:40, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:168, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:170
msgid "workspace.options.shadow-options.blur"
msgstr "تطميس"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:242
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:200
msgid "workspace.options.shadow-options.color"
msgstr "لون الظل"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:146
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:112
msgid "workspace.options.shadow-options.drop-shadow"
msgstr "إسقاط الظل"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:147
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:113
msgid "workspace.options.shadow-options.inner-shadow"
msgstr "التظليل الداخلي"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:38, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:190
+#: src/app/main/ui/inspect/attributes/shadow.cljs:38, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:158
msgid "workspace.options.shadow-options.offsetx"
msgstr "X"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:39, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:228
+#: src/app/main/ui/inspect/attributes/shadow.cljs:39, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:190
msgid "workspace.options.shadow-options.offsety"
msgstr "Y"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:41, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:215, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:217
+#: src/app/main/ui/inspect/attributes/shadow.cljs:41, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:179, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:181
msgid "workspace.options.shadow-options.spread"
msgstr "الانتشار"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:300
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:287
msgid "workspace.options.shadow-options.title"
msgstr "الظل"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:299
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:286
msgid "workspace.options.shadow-options.title.group"
msgstr "ظل المجموعة"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:298
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:285
msgid "workspace.options.shadow-options.title.multiple"
msgstr "ظلال الإختيار"
@@ -3975,7 +3963,7 @@ msgstr "ظلال الإختيار"
msgid "workspace.options.show-fill-on-export"
msgstr "أظهر في المصدر"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:445
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:442
msgid "workspace.options.show-in-viewer"
msgstr "أظهر في وضع العرض"
@@ -3983,7 +3971,7 @@ msgstr "أظهر في وضع العرض"
msgid "workspace.options.size"
msgstr "مقاس"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:305
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:302
msgid "workspace.options.size-presets"
msgstr "الإعدادات المسبقة للحجم"
@@ -4052,7 +4040,7 @@ msgstr "المثلث"
msgid "workspace.options.stroke-color"
msgstr "لون الضرب"
-#: src/app/main/ui/workspace/sidebar/options/rows/stroke_row.cljs:165
+#: src/app/main/ui/workspace/sidebar/options/rows/stroke_row.cljs:166
msgid "workspace.options.stroke-width"
msgstr "عرض الضرب"
@@ -4116,11 +4104,11 @@ msgstr "العرض التلقائي"
msgid "workspace.options.text-options.grow-fixed"
msgstr "مثبت"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:389
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:392
msgid "workspace.options.text-options.letter-spacing"
msgstr "تباعد الحروف"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:371
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:374
msgid "workspace.options.text-options.line-height"
msgstr "ارتفاع الخط"
@@ -4184,15 +4172,15 @@ msgstr "الأحرف الكبيرة"
msgid "workspace.options.use-play-button"
msgstr "استعمل زر التشغيل أعلاه لتشغيل منظر النموذج المبدئي."
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:351
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:348
msgid "workspace.options.width"
msgstr "عرض"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:383
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:380
msgid "workspace.options.x"
msgstr "X محور"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:394
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:391
msgid "workspace.options.y"
msgstr "Y محور"
@@ -4236,99 +4224,99 @@ msgstr "فصل العقد (%s)"
msgid "workspace.path.actions.snap-nodes"
msgstr "كسر العقد (%s)"
-#: src/app/main/ui/workspace/context_menu.cljs:537
+#: src/app/main/ui/workspace/context_menu.cljs:542
msgid "workspace.shape.menu.add-flex"
msgstr "إضافة تخطيط الثني"
-#: src/app/main/ui/workspace/context_menu.cljs:541
+#: src/app/main/ui/workspace/context_menu.cljs:546
msgid "workspace.shape.menu.add-grid"
msgstr "إضافة تخطيط التشبيك"
-#: src/app/main/ui/workspace/context_menu.cljs:265
+#: src/app/main/ui/workspace/context_menu.cljs:266
msgid "workspace.shape.menu.back"
msgstr "أرسل الى الخلف"
-#: src/app/main/ui/workspace/context_menu.cljs:262
+#: src/app/main/ui/workspace/context_menu.cljs:263
msgid "workspace.shape.menu.backward"
msgstr "أرسل الى الخلف"
-#: src/app/main/ui/workspace/context_menu.cljs:185
+#: src/app/main/ui/workspace/context_menu.cljs:186
msgid "workspace.shape.menu.copy"
msgstr "انسخ"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:438
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:454
msgid "workspace.shape.menu.create-annotation"
msgstr "إنشاء تعليق توضيحي"
-#: src/app/main/ui/workspace/context_menu.cljs:364
+#: src/app/main/ui/workspace/context_menu.cljs:366
msgid "workspace.shape.menu.create-artboard-from-selection"
msgstr "تحديد محتوى اللوحة"
-#: src/app/main/ui/workspace/context_menu.cljs:561
+#: src/app/main/ui/workspace/context_menu.cljs:568
msgid "workspace.shape.menu.create-component"
msgstr "إنشاء نعصر"
-#: src/app/main/ui/workspace/context_menu.cljs:565
+#: src/app/main/ui/workspace/context_menu.cljs:572
msgid "workspace.shape.menu.create-multiple-components"
msgstr "إنشاء عناصر جديدة"
-#: src/app/main/ui/workspace/context_menu.cljs:191
+#: src/app/main/ui/workspace/context_menu.cljs:192
msgid "workspace.shape.menu.cut"
msgstr "قطع"
-#: src/app/main/ui/workspace/context_menu.cljs:585, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:764, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1052
+#: src/app/main/ui/workspace/context_menu.cljs:598, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:773, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1061
msgid "workspace.shape.menu.delete"
msgstr "حذف"
-#: src/app/main/ui/workspace/context_menu.cljs:487
+#: src/app/main/ui/workspace/context_menu.cljs:489
msgid "workspace.shape.menu.delete-flow-start"
msgstr "حذف المخطط"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:443
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:459
msgid "workspace.shape.menu.detach-instance"
msgstr "فصل المثال"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:442
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:458
msgid "workspace.shape.menu.detach-instances-in-bulk"
msgstr "فصل الامثلة"
-#: src/app/main/ui/workspace/context_menu.cljs:428, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:75
+#: src/app/main/ui/workspace/context_menu.cljs:430, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:75
msgid "workspace.shape.menu.difference"
msgstr "الفارق"
-#: src/app/main/ui/workspace/context_menu.cljs:197
+#: src/app/main/ui/workspace/context_menu.cljs:198
msgid "workspace.shape.menu.duplicate"
msgstr "ينسخ"
-#: src/app/main/ui/workspace/context_menu.cljs:414
+#: src/app/main/ui/workspace/context_menu.cljs:416
msgid "workspace.shape.menu.edit"
msgstr "تحرير"
-#: src/app/main/ui/workspace/context_menu.cljs:434
+#: src/app/main/ui/workspace/context_menu.cljs:436, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:85
msgid "workspace.shape.menu.exclude"
msgstr "استبعاد"
-#: src/app/main/ui/workspace/context_menu.cljs:441, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:89
+#: src/app/main/ui/workspace/context_menu.cljs:443, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:89
msgid "workspace.shape.menu.flatten"
msgstr "تسطيح"
-#: src/app/main/ui/workspace/context_menu.cljs:282
+#: src/app/main/ui/workspace/context_menu.cljs:283
msgid "workspace.shape.menu.flip-horizontal"
msgstr "Flip horizontal"
-#: src/app/main/ui/workspace/context_menu.cljs:278
+#: src/app/main/ui/workspace/context_menu.cljs:279
msgid "workspace.shape.menu.flip-vertical"
msgstr "التوجيه الرئسي"
-#: src/app/main/ui/workspace/context_menu.cljs:489
+#: src/app/main/ui/workspace/context_menu.cljs:491
msgid "workspace.shape.menu.flow-start"
msgstr "بداية المخطط"
-#: src/app/main/ui/workspace/context_menu.cljs:256
+#: src/app/main/ui/workspace/context_menu.cljs:257
msgid "workspace.shape.menu.forward"
msgstr "النقل الى الأمام"
-#: src/app/main/ui/workspace/context_menu.cljs:259
+#: src/app/main/ui/workspace/context_menu.cljs:260
msgid "workspace.shape.menu.front"
msgstr "النقل الى الأمام"
@@ -4337,91 +4325,91 @@ msgstr "النقل الى الأمام"
msgid "workspace.shape.menu.go-main"
msgstr "انتقل الى ملف العنصر الأصلي"
-#: src/app/main/ui/workspace/context_menu.cljs:350
+#: src/app/main/ui/workspace/context_menu.cljs:352
msgid "workspace.shape.menu.group"
msgstr "مجموعة"
-#: src/app/main/ui/workspace/context_menu.cljs:458, src/app/main/ui/workspace/sidebar/layer_item.cljs:145
+#: src/app/main/ui/workspace/context_menu.cljs:460, src/app/main/ui/workspace/sidebar/layer_item.cljs:151
msgid "workspace.shape.menu.hide"
msgstr "إخفاء"
-#: src/app/main/ui/workspace/context_menu.cljs:658, src/app/main/ui/workspace/main_menu.cljs:414
+#: src/app/main/ui/workspace/context_menu.cljs:674, src/app/main/ui/workspace/main_menu.cljs:414
msgid "workspace.shape.menu.hide-ui"
msgstr "أظهر أو إخف UI"
-#: src/app/main/ui/workspace/context_menu.cljs:431
+#: src/app/main/ui/workspace/context_menu.cljs:433, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:80
msgid "workspace.shape.menu.intersection"
msgstr "التفاعلات"
-#: src/app/main/ui/workspace/context_menu.cljs:466, src/app/main/ui/workspace/sidebar/layer_item.cljs:153, src/app/main/ui/workspace/sidebar/options/menus/layer.cljs:204
+#: src/app/main/ui/workspace/context_menu.cljs:468, src/app/main/ui/workspace/sidebar/layer_item.cljs:159, src/app/main/ui/workspace/sidebar/options/menus/layer.cljs:204
msgid "workspace.shape.menu.lock"
msgstr "إغلاق"
-#: src/app/main/ui/workspace/context_menu.cljs:355
+#: src/app/main/ui/workspace/context_menu.cljs:357
msgid "workspace.shape.menu.mask"
msgstr "قناع"
-#: src/app/main/ui/workspace/context_menu.cljs:194, src/app/main/ui/workspace/context_menu.cljs:655
+#: src/app/main/ui/workspace/context_menu.cljs:195, src/app/main/ui/workspace/context_menu.cljs:671
msgid "workspace.shape.menu.paste"
msgstr "معجون"
-#: src/app/main/ui/workspace/context_menu.cljs:424
+#: src/app/main/ui/workspace/context_menu.cljs:426
msgid "workspace.shape.menu.path"
msgstr "طريق"
-#: src/app/main/ui/workspace/context_menu.cljs:528
+#: src/app/main/ui/workspace/context_menu.cljs:532
msgid "workspace.shape.menu.remove-flex"
msgstr "إزالة تخطيط المنحنى"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:447
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:463
msgid "workspace.shape.menu.reset-overrides"
msgstr "إعادة ضبط التجاوزات"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:450
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:466
msgid "workspace.shape.menu.restore-main"
msgstr "استعادة العنصر الرئيسي"
-#: src/app/main/ui/workspace/context_menu.cljs:246
+#: src/app/main/ui/workspace/context_menu.cljs:247
msgid "workspace.shape.menu.select-layer"
msgstr "اختيار الطبقة"
-#: src/app/main/ui/workspace/context_menu.cljs:455, src/app/main/ui/workspace/sidebar/layer_item.cljs:144
+#: src/app/main/ui/workspace/context_menu.cljs:457, src/app/main/ui/workspace/sidebar/layer_item.cljs:150
msgid "workspace.shape.menu.show"
msgstr "العرض"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:435
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:451
msgid "workspace.shape.menu.show-in-assets"
msgstr "العرض في لوحة الاصول"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:453, src/app/main/ui/workspace/sidebar/assets/components.cljs:563
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:469, src/app/main/ui/workspace/sidebar/assets/components.cljs:573
msgid "workspace.shape.menu.show-main"
msgstr "أظهر المكون الرئيسي"
-#: src/app/main/ui/workspace/context_menu.cljs:297
+#: src/app/main/ui/workspace/context_menu.cljs:298
msgid "workspace.shape.menu.thumbnail-remove"
msgstr "أطهر الصورة المصغرة"
-#: src/app/main/ui/workspace/context_menu.cljs:299
+#: src/app/main/ui/workspace/context_menu.cljs:300
msgid "workspace.shape.menu.thumbnail-set"
msgstr "تعيين كصورة مصغرة"
-#: src/app/main/ui/workspace/context_menu.cljs:419
+#: src/app/main/ui/workspace/context_menu.cljs:421
msgid "workspace.shape.menu.transform-to-path"
msgstr "تحويل الى المسار"
-#: src/app/main/ui/workspace/context_menu.cljs:346
+#: src/app/main/ui/workspace/context_menu.cljs:348
msgid "workspace.shape.menu.ungroup"
msgstr "فك التجميع"
-#: src/app/main/ui/workspace/context_menu.cljs:425, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:70
+#: src/app/main/ui/workspace/context_menu.cljs:427, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:70
msgid "workspace.shape.menu.union"
msgstr "اتحاد"
-#: src/app/main/ui/workspace/context_menu.cljs:463, src/app/main/ui/workspace/sidebar/layer_item.cljs:152, src/app/main/ui/workspace/sidebar/options/menus/layer.cljs:210
+#: src/app/main/ui/workspace/context_menu.cljs:465, src/app/main/ui/workspace/sidebar/layer_item.cljs:158, src/app/main/ui/workspace/sidebar/options/menus/layer.cljs:210
msgid "workspace.shape.menu.unlock"
msgstr "الغاء القفل"
-#: src/app/main/ui/workspace/context_menu.cljs:360
+#: src/app/main/ui/workspace/context_menu.cljs:362
msgid "workspace.shape.menu.unmask"
msgstr "كشف القناع"
@@ -4430,7 +4418,7 @@ msgstr "كشف القناع"
msgid "workspace.shape.menu.update-components-in-bulk"
msgstr "تحديث العناصر الرئيسية"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:456
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:472
msgid "workspace.shape.menu.update-main"
msgstr "تحديث العنصر الرئيسي"
@@ -4442,11 +4430,11 @@ msgstr "انهيار الشريط الجانبي"
msgid "workspace.sidebar.expand"
msgstr "توسيع الشريط الجانبي"
-#: src/app/main/ui/workspace/right_header.cljs:246, src/app/main/ui/workspace/right_header.cljs:247
+#: src/app/main/ui/workspace/right_header.cljs:212, src/app/main/ui/workspace/right_header.cljs:213
msgid "workspace.sidebar.history"
msgstr "التاريخ"
-#: src/app/main/ui/workspace/sidebar/layers.cljs:525, src/app/main/ui/workspace/sidebar.cljs:127, src/app/main/ui/workspace/sidebar.cljs:131, src/app/main/ui/workspace/sidebar.cljs:140
+#: src/app/main/ui/workspace/sidebar/layers.cljs:525, src/app/main/ui/workspace/sidebar.cljs:128, src/app/main/ui/workspace/sidebar.cljs:132, src/app/main/ui/workspace/sidebar.cljs:141
msgid "workspace.sidebar.layers"
msgstr "الطبقات"
@@ -4478,7 +4466,7 @@ msgstr "بسومات"
msgid "workspace.sidebar.layers.texts"
msgstr "نصوص"
-#: src/app/main/ui/viewer/inspect/attributes/svg.cljs:56, src/app/main/ui/workspace/sidebar/options/menus/svg_attrs.cljs:101
+#: src/app/main/ui/inspect/attributes/svg.cljs:56, src/app/main/ui/workspace/sidebar/options/menus/svg_attrs.cljs:101
msgid "workspace.sidebar.options.svg-attrs.title"
msgstr "السمات المستوردةSVG"
@@ -4486,11 +4474,11 @@ msgstr "السمات المستوردةSVG"
msgid "workspace.sidebar.sitemap"
msgstr "صفحات"
-#: src/app/main/ui/workspace/left_header.cljs:92
+#: src/app/main/ui/workspace/left_header.cljs:97
msgid "workspace.sitemap"
msgstr "خريطة الموقع"
-#: src/app/main/ui/workspace/sidebar.cljs:134, src/app/main/ui/workspace/sidebar.cljs:143
+#: src/app/main/ui/workspace/sidebar.cljs:135, src/app/main/ui/workspace/sidebar.cljs:144
msgid "workspace.toolbar.assets"
msgstr "أصول"
@@ -4498,35 +4486,35 @@ msgstr "أصول"
msgid "workspace.toolbar.color-palette"
msgstr "لوحة اللون (%s)"
-#: src/app/main/ui/workspace/right_header.cljs:235, src/app/main/ui/workspace/right_header.cljs:236
+#: src/app/main/ui/workspace/right_header.cljs:201, src/app/main/ui/workspace/right_header.cljs:202
msgid "workspace.toolbar.comments"
msgstr "تعليقات (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:181, src/app/main/ui/workspace/top_toolbar.cljs:182
+#: src/app/main/ui/workspace/top_toolbar.cljs:190, src/app/main/ui/workspace/top_toolbar.cljs:191
msgid "workspace.toolbar.curve"
msgstr "منحنى (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:161, src/app/main/ui/workspace/top_toolbar.cljs:162
+#: src/app/main/ui/workspace/top_toolbar.cljs:170, src/app/main/ui/workspace/top_toolbar.cljs:171
msgid "workspace.toolbar.ellipse"
msgstr "الشكل البيضاوي (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:143, src/app/main/ui/workspace/top_toolbar.cljs:144
+#: src/app/main/ui/workspace/top_toolbar.cljs:132, src/app/main/ui/workspace/top_toolbar.cljs:153
msgid "workspace.toolbar.frame"
msgstr "لوحة (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:60, src/app/main/ui/workspace/top_toolbar.cljs:61
+#: src/app/main/ui/workspace/top_toolbar.cljs:61, src/app/main/ui/workspace/top_toolbar.cljs:62
msgid "workspace.toolbar.image"
msgstr "صورة (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:133, src/app/main/ui/workspace/top_toolbar.cljs:134
+#: src/app/main/ui/workspace/top_toolbar.cljs:142, src/app/main/ui/workspace/top_toolbar.cljs:143
msgid "workspace.toolbar.move"
msgstr "تحريك (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:190, src/app/main/ui/workspace/top_toolbar.cljs:191
+#: src/app/main/ui/workspace/top_toolbar.cljs:199, src/app/main/ui/workspace/top_toolbar.cljs:200
msgid "workspace.toolbar.path"
msgstr "مسار (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:152, src/app/main/ui/workspace/top_toolbar.cljs:153
+#: src/app/main/ui/workspace/top_toolbar.cljs:161, src/app/main/ui/workspace/top_toolbar.cljs:162
msgid "workspace.toolbar.rect"
msgstr "مستطيل (%s)"
@@ -4535,7 +4523,7 @@ msgstr "مستطيل (%s)"
msgid "workspace.toolbar.shortcuts"
msgstr "الإختصار (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:170, src/app/main/ui/workspace/top_toolbar.cljs:171
+#: src/app/main/ui/workspace/top_toolbar.cljs:179, src/app/main/ui/workspace/top_toolbar.cljs:180
msgid "workspace.toolbar.text"
msgstr "نص (%s)"
@@ -4692,19 +4680,19 @@ msgstr "انتهت العملية %s"
msgid "workspace.undo.title"
msgstr "تاريخ"
-#: src/app/main/data/workspace/libraries.cljs:1223, src/app/main/ui/workspace/sidebar/versions.cljs:261
+#: src/app/main/data/workspace/libraries.cljs:1224, src/app/main/ui/workspace/sidebar/versions.cljs:261
msgid "workspace.updates.dismiss"
msgstr "رفض"
-#: src/app/main/data/workspace/libraries.cljs:1221
+#: src/app/main/data/workspace/libraries.cljs:1222
msgid "workspace.updates.more-info"
msgstr "مزيد من المعلومات"
-#: src/app/main/data/workspace/libraries.cljs:1219
+#: src/app/main/data/workspace/libraries.cljs:1220
msgid "workspace.updates.there-are-updates"
msgstr "يوجد تحديثات في المكتبة المشتركة"
-#: src/app/main/data/workspace/libraries.cljs:1225
+#: src/app/main/data/workspace/libraries.cljs:1226
msgid "workspace.updates.update"
msgstr "تحديث"
diff --git a/frontend/translations/bn.po b/frontend/translations/bn.po
index 41ebc8f9e1..57032a8517 100644
--- a/frontend/translations/bn.po
+++ b/frontend/translations/bn.po
@@ -29,13 +29,13 @@ msgstr "পাসওয়ার্ড নিশ্চিত করুন"
msgid "auth.create-demo-account"
msgstr "ডেমো অ্যাকাউন্ট তৈরী করুন"
-#: src/app/main/ui/auth/login.cljs:42
+#: src/app/main/ui/auth/login.cljs:43
msgid "auth.demo-warning"
msgstr ""
"এটি একটি ডেমো সার্ভিস। প্রয়োজনীয় কোনো কাজে ব্যবহার করবেন না। কিছু সময় পর "
"প্রজেক্টগুলো মুছে ফেলা হবে।"
-#: src/app/main/ui/auth/login.cljs:190, src/app/main/ui/viewer/login.cljs:84
+#: src/app/main/ui/auth/login.cljs:189, src/app/main/ui/viewer/login.cljs:84
msgid "auth.forgot-password"
msgstr "পাসওয়ার্ড ভুলে গেছেন?"
@@ -47,27 +47,27 @@ msgstr "পুরো নাম"
msgid "auth.login-here"
msgstr "এখানে লগিন করুন"
-#: src/app/main/ui/auth/login.cljs:196
+#: src/app/main/ui/auth/login.cljs:195
msgid "auth.login-submit"
msgstr "লগিন"
-#: src/app/main/ui/auth/login.cljs:223
+#: src/app/main/ui/auth/login.cljs:222
msgid "auth.login-with-github-submit"
msgstr "গিটহাব"
-#: src/app/main/ui/auth/login.cljs:229
+#: src/app/main/ui/auth/login.cljs:228
msgid "auth.login-with-gitlab-submit"
msgstr "গিটল্যাব"
-#: src/app/main/ui/auth/login.cljs:217
+#: src/app/main/ui/auth/login.cljs:216
msgid "auth.login-with-google-submit"
msgstr "গুগল"
-#: src/app/main/ui/auth/login.cljs:202
+#: src/app/main/ui/auth/login.cljs:201
msgid "auth.login-with-ldap-submit"
msgstr "LDAP"
-#: src/app/main/ui/auth/login.cljs:235, src/app/main/ui/auth/login.cljs:256
+#: src/app/main/ui/auth/login.cljs:234, src/app/main/ui/auth/login.cljs:255
msgid "auth.login-with-oidc-submit"
msgstr "ওপেনআইডি"
diff --git a/frontend/translations/ca.po b/frontend/translations/ca.po
index ee9cbd35f4..f7706d45a2 100644
--- a/frontend/translations/ca.po
+++ b/frontend/translations/ca.po
@@ -38,13 +38,13 @@ msgstr "Creeu un compte de prova"
msgid "auth.create-demo-profile"
msgstr "Ho voleu provar?"
-#: src/app/main/ui/auth/login.cljs:42
+#: src/app/main/ui/auth/login.cljs:43
msgid "auth.demo-warning"
msgstr ""
"Aquest és un servei de PROVA. NO L'UTILITZEU en treballs reals, ja que els "
"projectes s'eliminaran periòdicament."
-#: src/app/main/ui/auth/login.cljs:190, src/app/main/ui/viewer/login.cljs:84
+#: src/app/main/ui/auth/login.cljs:189, src/app/main/ui/viewer/login.cljs:84
msgid "auth.forgot-password"
msgstr "Heu oblidat la contrasenya?"
@@ -56,27 +56,27 @@ msgstr "Nom complet"
msgid "auth.login-here"
msgstr "Inicieu la sessió aquí."
-#: src/app/main/ui/auth/login.cljs:196
+#: src/app/main/ui/auth/login.cljs:195
msgid "auth.login-submit"
msgstr "Entra"
-#: src/app/main/ui/auth/login.cljs:223
+#: src/app/main/ui/auth/login.cljs:222
msgid "auth.login-with-github-submit"
msgstr "GitHub"
-#: src/app/main/ui/auth/login.cljs:229
+#: src/app/main/ui/auth/login.cljs:228
msgid "auth.login-with-gitlab-submit"
msgstr "GitLab"
-#: src/app/main/ui/auth/login.cljs:217
+#: src/app/main/ui/auth/login.cljs:216
msgid "auth.login-with-google-submit"
msgstr "Google"
-#: src/app/main/ui/auth/login.cljs:202
+#: src/app/main/ui/auth/login.cljs:201
msgid "auth.login-with-ldap-submit"
msgstr "LDAP"
-#: src/app/main/ui/auth/login.cljs:235, src/app/main/ui/auth/login.cljs:256
+#: src/app/main/ui/auth/login.cljs:234, src/app/main/ui/auth/login.cljs:255
msgid "auth.login-with-oidc-submit"
msgstr "OpenID"
@@ -100,7 +100,7 @@ msgstr "S'ha enviat un enllaç de recuperació de contrasenya al vostre correu."
msgid "auth.notifications.team-invitation-accepted"
msgstr "Us heu unit a l'equip correctament"
-#: src/app/main/ui/auth/login.cljs:180, src/app/main/ui/auth/register.cljs:95
+#: src/app/main/ui/auth/login.cljs:179, src/app/main/ui/auth/register.cljs:95
msgid "auth.password"
msgstr "Contrasenya"
@@ -128,11 +128,11 @@ msgstr "Heu oblidat la contrasenya?"
msgid "auth.recovery-submit"
msgstr "Canvieu la contrasenya"
-#: src/app/main/ui/auth/login.cljs:299, src/app/main/ui/static.cljs:141, src/app/main/ui/viewer/login.cljs:87
+#: src/app/main/ui/auth/login.cljs:298, src/app/main/ui/static.cljs:141, src/app/main/ui/viewer/login.cljs:87
msgid "auth.register"
msgstr "No teniu un compte?"
-#: src/app/main/ui/auth/login.cljs:303, src/app/main/ui/auth/register.cljs:101, src/app/main/ui/auth/register.cljs:240, src/app/main/ui/static.cljs:145, src/app/main/ui/viewer/login.cljs:91
+#: src/app/main/ui/auth/login.cljs:302, src/app/main/ui/auth/register.cljs:101, src/app/main/ui/auth/register.cljs:240, src/app/main/ui/static.cljs:145, src/app/main/ui/viewer/login.cljs:91
msgid "auth.register-submit"
msgstr "Creeu un compte"
@@ -145,7 +145,7 @@ msgstr "Crea un compte"
msgid "auth.sidebar-tagline"
msgstr "La solució de codi obert per a dissenyar i prototipar."
-#: src/app/main/ui/auth/register.cljs:290, src/app/main/ui/dashboard/sidebar.cljs:1053, src/app/main/ui/workspace/main_menu.cljs:154
+#: src/app/main/ui/auth/register.cljs:290, src/app/main/ui/dashboard/sidebar.cljs:1054, src/app/main/ui/workspace/main_menu.cljs:154
msgid "auth.terms-of-service"
msgstr "Condicions del servei"
@@ -153,7 +153,7 @@ msgstr "Condicions del servei"
msgid "auth.verification-email-sent"
msgstr "S'ha enviat un correu de verificació a"
-#: src/app/main/ui/workspace/libraries.cljs:311
+#: src/app/main/ui/workspace/libraries.cljs:308
msgid "common.publish"
msgstr "Publica"
@@ -225,7 +225,7 @@ msgstr "Compartiu prototips"
msgid "common.share-link.view-all"
msgstr "Selecciona-ho tot"
-#: src/app/main/ui/workspace/libraries.cljs:307
+#: src/app/main/ui/workspace/libraries.cljs:304
msgid "common.unpublish"
msgstr "Despublica"
@@ -299,7 +299,7 @@ msgstr "Afegeix a la biblioteca compartida"
msgid "dashboard.change-email"
msgstr "Canvia el correu"
-#: src/app/main/data/dashboard.cljs:288, src/app/main/data/dashboard.cljs:507
+#: src/app/main/data/dashboard.cljs:298, src/app/main/data/dashboard.cljs:526, src/app/main/data/workspace.cljs:544
msgid "dashboard.copy-suffix"
msgstr "(còpia)"
@@ -423,25 +423,25 @@ msgstr ""
msgid "dashboard.export.title"
msgstr "Exporta els fitxers"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:313
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:316
msgid "dashboard.fonts.deleted-placeholder"
msgstr "S'ha eliminat la tipografia"
-#: src/app/main/ui/dashboard/fonts.cljs:210
+#: src/app/main/ui/dashboard/fonts.cljs:212
msgid "dashboard.fonts.dismiss-all"
msgstr "Descarta-ho tot"
-#: src/app/main/ui/dashboard/fonts.cljs:445
+#: src/app/main/ui/dashboard/fonts.cljs:447
msgid "dashboard.fonts.empty-placeholder"
msgstr "Encara no teniu cap tipografia personalitzada instal·lada."
-#: src/app/main/ui/dashboard/fonts.cljs:198
+#: src/app/main/ui/dashboard/fonts.cljs:200
msgid "dashboard.fonts.fonts-added"
msgid_plural "dashboard.fonts.fonts-added"
msgstr[0] "S'ha afegit 1 tipografia"
msgstr[1] "S'han afegit %s tipografies"
-#: src/app/main/ui/dashboard/fonts.cljs:174
+#: src/app/main/ui/dashboard/fonts.cljs:175
#, markdown
msgid "dashboard.fonts.hero-text1"
msgstr ""
@@ -451,21 +451,21 @@ msgstr ""
"sola família tipogràfica**. Podeu pujar tipografies en aquests formats: "
"**TTF, OTF i WOFF** (només en cal un)."
-#: src/app/main/ui/dashboard/fonts.cljs:186
+#: src/app/main/ui/dashboard/fonts.cljs:188
#, markdown
msgid "dashboard.fonts.hero-text2"
msgstr ""
"Només podeu pujar tipografies de la vostra propietat o de les que tingueu "
"una llicència que us permeti utilitzar-los al Penpot. Teniu més informació "
"a la secció de drets de contingut de les [Condicions del servei del "
-"Penpot](%s). També podeu llegir sobre les "
-"[llicències de les tipografies](https://www.typography.com/faq)."
+"Penpot](%s). També podeu llegir sobre les [llicències de les "
+"tipografies](https://www.typography.com/faq)."
-#: src/app/main/ui/dashboard/fonts.cljs:206
+#: src/app/main/ui/dashboard/fonts.cljs:208
msgid "dashboard.fonts.upload-all"
msgstr "Puja-ho tot"
-#: src/app/main/ui/dashboard/import.cljs:452, src/app/main/ui/dashboard/project_menu.cljs:109
+#: src/app/main/ui/dashboard/import.cljs:454, src/app/main/ui/dashboard/project_menu.cljs:109
msgid "dashboard.import"
msgstr "Importa fitxers de Penpot"
@@ -477,11 +477,11 @@ msgstr "Vaja! No s'ha pogut importar aquest fitxer"
msgid "dashboard.import.import-error"
msgstr "S'ha produït un problema en importar el fitxer i no s'ha importat."
-#: src/app/main/ui/dashboard/import.cljs:466
+#: src/app/main/ui/dashboard/import.cljs:468
msgid "dashboard.import.import-message"
msgstr "S'han importat %s fitxers correctament."
-#: src/app/main/ui/dashboard/import.cljs:461
+#: src/app/main/ui/dashboard/import.cljs:463
msgid "dashboard.import.import-warning"
msgstr "Alguns fitxers contenen objectes no vàlids que s'han eliminat."
@@ -521,29 +521,29 @@ msgstr "Convida a l'equip"
msgid "dashboard.leave-team"
msgstr "Abandona l'equip"
-#: src/app/main/ui/dashboard/templates.cljs:82, src/app/main/ui/dashboard/templates.cljs:157
+#: src/app/main/ui/dashboard/templates.cljs:83, src/app/main/ui/dashboard/templates.cljs:168
msgid "dashboard.libraries-and-templates"
msgstr "Biblioteques i plantilles"
-#: src/app/main/ui/dashboard/templates.cljs:158
+#: src/app/main/ui/dashboard/templates.cljs:169
msgid "dashboard.libraries-and-templates.explore"
msgstr "Explora'n més i coneix com contribuir-hi"
-#: src/app/main/ui/dashboard/import.cljs:358, src/app/main/ui/workspace/libraries.cljs:150
+#: src/app/main/ui/dashboard/import.cljs:360, src/app/main/ui/workspace/libraries.cljs:151
msgid "dashboard.libraries-and-templates.import-error"
msgstr ""
"Hi ha hagut un problema en importar la plantilla. La plantilla no s'ha "
"importat."
-#: src/app/main/ui/dashboard/libraries.cljs:51
+#: src/app/main/ui/dashboard/libraries.cljs:66
msgid "dashboard.libraries-title"
msgstr "Biblioteques compartides"
-#: src/app/main/ui/dashboard/placeholder.cljs:55
+#: src/app/main/ui/dashboard/placeholder.cljs:100
msgid "dashboard.loading-files"
msgstr "S'estan carregant els fitxers…"
-#: src/app/main/ui/dashboard/fonts.cljs:439
+#: src/app/main/ui/dashboard/fonts.cljs:441
msgid "dashboard.loading-fonts"
msgstr "s'estan carregant les tipografies…"
@@ -559,11 +559,11 @@ msgstr "Mou %s fitxers a"
msgid "dashboard.move-to-other-team"
msgstr "Mou a un altre equip"
-#: src/app/main/ui/dashboard/files.cljs:105, src/app/main/ui/dashboard/projects.cljs:252, src/app/main/ui/dashboard/projects.cljs:253
+#: src/app/main/ui/dashboard/files.cljs:105, src/app/main/ui/dashboard/projects.cljs:253, src/app/main/ui/dashboard/projects.cljs:254
msgid "dashboard.new-file"
msgstr "+ Fitxer nou"
-#: src/app/main/data/dashboard.cljs:482, src/app/main/data/dashboard.cljs:591
+#: src/app/main/data/dashboard.cljs:497, src/app/main/data/dashboard.cljs:609
msgid "dashboard.new-file-prefix"
msgstr "Fitxer nou"
@@ -571,7 +571,7 @@ msgstr "Fitxer nou"
msgid "dashboard.new-project"
msgstr "+ Crea un projecte"
-#: src/app/main/data/dashboard.cljs:252, src/app/main/data/dashboard.cljs:594
+#: src/app/main/data/dashboard.cljs:257, src/app/main/data/dashboard.cljs:612
msgid "dashboard.new-project-prefix"
msgstr "Crea un projecte"
@@ -603,7 +603,7 @@ msgstr "%s membres"
msgid "dashboard.open-in-new-tab"
msgstr "Obre el fitxer en una pestanya nova"
-#: src/app/main/ui/dashboard/files.cljs:118, src/app/main/ui/dashboard/projects.cljs:261, src/app/main/ui/dashboard/projects.cljs:262
+#: src/app/main/ui/dashboard/files.cljs:118, src/app/main/ui/dashboard/grid.cljs:426, src/app/main/ui/dashboard/projects.cljs:262, src/app/main/ui/dashboard/projects.cljs:263
msgid "dashboard.options"
msgstr "Opcions"
@@ -648,7 +648,7 @@ msgstr "Selecciona la llengua de la interfície"
msgid "dashboard.select-ui-theme"
msgstr "Selecciona un tema"
-#: src/app/main/ui/dashboard/projects.cljs:304
+#: src/app/main/ui/dashboard/projects.cljs:305
msgid "dashboard.show-all-files"
msgstr "Mostra tots els fitxers"
@@ -668,7 +668,7 @@ msgstr "S'ha duplicat el fitxer"
msgid "dashboard.success-duplicate-project"
msgstr "S'ha eliminat el projecte"
-#: src/app/main/ui/dashboard/file_menu.cljs:131, src/app/main/ui/dashboard/grid.cljs:588, src/app/main/ui/dashboard/sidebar.cljs:159
+#: src/app/main/ui/dashboard/file_menu.cljs:131, src/app/main/ui/dashboard/grid.cljs:614, src/app/main/ui/dashboard/sidebar.cljs:159
msgid "dashboard.success-move-file"
msgstr "S'ha mogut el fitxer"
@@ -724,7 +724,7 @@ msgstr "Correu electrònic"
msgid "dashboard.your-name"
msgstr "Nom"
-#: src/app/main/ui/dashboard/file_menu.cljs:39, src/app/main/ui/dashboard/fonts.cljs:35, src/app/main/ui/dashboard/libraries.cljs:40, src/app/main/ui/dashboard/projects.cljs:345, src/app/main/ui/dashboard/search.cljs:48, src/app/main/ui/dashboard/sidebar.cljs:319, src/app/main/ui/dashboard/team.cljs:531, src/app/main/ui/dashboard/team.cljs:781, src/app/main/ui/dashboard/team.cljs:1045, src/app/main/ui/dashboard/team.cljs:1092
+#: src/app/main/ui/dashboard/file_menu.cljs:39, src/app/main/ui/dashboard/fonts.cljs:36, src/app/main/ui/dashboard/libraries.cljs:55, src/app/main/ui/dashboard/projects.cljs:348, src/app/main/ui/dashboard/search.cljs:48, src/app/main/ui/dashboard/sidebar.cljs:319, src/app/main/ui/dashboard/team.cljs:531, src/app/main/ui/dashboard/team.cljs:781, src/app/main/ui/dashboard/team.cljs:1045, src/app/main/ui/dashboard/team.cljs:1092
msgid "dashboard.your-penpot"
msgstr "El meu Penpot"
@@ -740,11 +740,11 @@ msgstr "Atenció"
msgid "ds.component-subtitle"
msgstr "Components a actualitzar:"
-#: src/app/main/ui/comments.cljs:653, src/app/main/ui/comments.cljs:686, src/app/main/ui/comments.cljs:755, src/app/main/ui/confirm.cljs:36, src/app/main/ui/workspace/plugins.cljs:330, src/app/main/ui/workspace/plugins.cljs:384
+#: src/app/main/ui/comments.cljs:672, src/app/main/ui/confirm.cljs:36, src/app/main/ui/workspace/plugins.cljs:330, src/app/main/ui/workspace/plugins.cljs:384
msgid "ds.confirm-cancel"
msgstr "Cancel·la"
-#: src/app/main/ui/confirm.cljs:37, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:141
+#: src/app/main/ui/confirm.cljs:37, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:148
msgid "ds.confirm-ok"
msgstr "D'acord"
@@ -752,7 +752,7 @@ msgstr "D'acord"
msgid "ds.confirm-title"
msgstr "N'esteu segur?"
-#: src/app/main/ui/auth/login.cljs:77
+#: src/app/main/ui/auth/login.cljs:78
msgid "errors.auth-provider-not-configured"
msgstr "L'autenticació del proveïdor no està configurada."
@@ -760,7 +760,7 @@ msgstr "L'autenticació del proveïdor no està configurada."
msgid "errors.auth.unable-to-login"
msgstr "Sembla que no esteu autenticat o que la sessió ha caducat."
-#: src/app/main/data/workspace.cljs:1463, src/app/main/data/workspace.cljs:1660
+#: src/app/main/data/workspace.cljs:1484, src/app/main/data/workspace.cljs:1682
msgid "errors.clipboard-not-implemented"
msgstr "El vostre navegador no pot fer aquesta operació"
@@ -772,7 +772,7 @@ msgstr "Aquest correu ja està en ús"
msgid "errors.email-already-validated"
msgstr "Aquest correu ja està validat."
-#, unused
+#: src/app/main/ui/auth/register.cljs:64, src/app/main/ui/settings/password.cljs:27
msgid "errors.email-as-password"
msgstr "No podeu fer servir l'adreça de correu com a contrasenya"
@@ -784,7 +784,7 @@ msgstr "El correu «%s» té molts informes de retorn permanents."
msgid "errors.email-spam-or-permanent-bounces"
msgstr "El correu «%s» s'ha marcat com a brossa o rebot permanent."
-#: src/app/main/data/auth.cljs:322, src/app/main/ui/auth/login.cljs:80, src/app/main/ui/auth/login.cljs:121, src/app/main/ui/auth/register.cljs:66, src/app/main/ui/auth/register.cljs:207, src/app/main/ui/auth/verify_token.cljs:94, src/app/main/ui/dashboard/team.cljs:193, src/app/main/ui/onboarding/team_choice.cljs:112, src/app/main/ui/settings/access_tokens.cljs:80, src/app/main/ui/settings/feedback.cljs:49
+#: src/app/main/data/auth.cljs:322, src/app/main/ui/auth/login.cljs:81, src/app/main/ui/auth/login.cljs:122, src/app/main/ui/auth/register.cljs:66, src/app/main/ui/auth/register.cljs:207, src/app/main/ui/auth/verify_token.cljs:94, src/app/main/ui/dashboard/team.cljs:193, src/app/main/ui/onboarding/team_choice.cljs:112, src/app/main/ui/settings/access_tokens.cljs:80, src/app/main/ui/settings/feedback.cljs:49
msgid "errors.generic"
msgstr "Alguna cosa ha anat malament."
@@ -792,8 +792,7 @@ msgstr "Alguna cosa ha anat malament."
msgid "errors.invalid-color"
msgstr "El color no és vàlid"
-#: src/app/main/ui/settings/change_email.cljs
-#, unused
+#: src/app/main/ui/settings/change_email.cljs:62
msgid "errors.invalid-email-confirmation"
msgstr "El correu de confirmació ha de coincidir"
@@ -809,7 +808,7 @@ msgstr "Invitació no vàlida"
msgid "errors.invite-invalid.info"
msgstr "Aquesta invitació pot estar cancel·lada o caducada."
-#: src/app/main/ui/auth/login.cljs:106
+#: src/app/main/ui/auth/login.cljs:107
msgid "errors.ldap-disabled"
msgstr "L'autenticació LDAP està inhabilitada."
@@ -843,7 +842,7 @@ msgstr "La contrasenya de confirmació ha de coincidir"
msgid "errors.password-too-short"
msgstr "La contrasenya ha de tenir 8 caràcters com a mínim"
-#: src/app/main/data/auth.cljs:312, src/app/main/ui/auth/login.cljs:102, src/app/main/ui/auth/login.cljs:110
+#: src/app/main/data/auth.cljs:312, src/app/main/ui/auth/login.cljs:103, src/app/main/ui/auth/login.cljs:111
msgid "errors.profile-blocked"
msgstr "El perfil està bloquejat"
@@ -881,12 +880,11 @@ msgstr "S'ha produït un error inesperat."
msgid "errors.unexpected-token"
msgstr "Token desconegut"
-#: src/app/main/ui/auth/login.cljs:114, src/app/main/ui/auth/login.cljs:118
+#: src/app/main/ui/auth/login.cljs:115, src/app/main/ui/auth/login.cljs:119
msgid "errors.wrong-credentials"
msgstr "El nom d'usuari o la contrasenya sembla incorrecte."
-#: src/app/main/ui/settings/password.cljs
-#, unused
+#: src/app/main/ui/settings/password.cljs:24
msgid "errors.wrong-old-password"
msgstr "La contrasenya anterior no és correcta"
@@ -933,11 +931,11 @@ msgstr "Compte per a ajudar amb dubtes tècnics."
msgid "feedback.twitter-title"
msgstr "Compte de X d'ajuda"
-#: src/app/main/ui/settings/notifications.cljs:38, src/app/main/ui/settings/password.cljs:29
+#: src/app/main/ui/settings/password.cljs:29
msgid "generic.error"
msgstr "S'ha produït un error"
-#: src/app/main/ui/viewer/inspect/attributes/blur.cljs:26
+#: src/app/main/ui/inspect/attributes/blur.cljs:26
msgid "inspect.attributes.blur"
msgstr "Difuminat"
@@ -945,31 +943,31 @@ msgstr "Difuminat"
msgid "inspect.attributes.blur.value"
msgstr "Valor"
-#: src/app/main/ui/viewer/inspect/attributes/common.cljs:112
+#: src/app/main/ui/inspect/attributes/common.cljs:112
msgid "inspect.attributes.color.hex"
msgstr "HEX"
-#: src/app/main/ui/viewer/inspect/attributes/common.cljs:114
+#: src/app/main/ui/inspect/attributes/common.cljs:114
msgid "inspect.attributes.color.hsla"
msgstr "HSLA"
-#: src/app/main/ui/viewer/inspect/attributes/common.cljs:113
+#: src/app/main/ui/inspect/attributes/common.cljs:113
msgid "inspect.attributes.color.rgba"
msgstr "RGBA"
-#: src/app/main/ui/viewer/inspect/attributes/fill.cljs:57
+#: src/app/main/ui/inspect/attributes/fill.cljs:57
msgid "inspect.attributes.fill"
msgstr "Emplenat"
-#: src/app/main/ui/viewer/inspect/attributes/common.cljs:99, src/app/main/ui/viewer/inspect/attributes/image.cljs:51
+#: src/app/main/ui/inspect/attributes/common.cljs:99, src/app/main/ui/inspect/attributes/image.cljs:51
msgid "inspect.attributes.image.download"
msgstr "Baixa la imatge original"
-#: src/app/main/ui/viewer/inspect/attributes/image.cljs:39
+#: src/app/main/ui/inspect/attributes/image.cljs:39
msgid "inspect.attributes.image.height"
msgstr "Alçada"
-#: src/app/main/ui/viewer/inspect/attributes/image.cljs:32
+#: src/app/main/ui/inspect/attributes/image.cljs:32
msgid "inspect.attributes.image.width"
msgstr "Amplada"
@@ -1008,11 +1006,11 @@ msgstr "Superior"
msgid "inspect.attributes.layout.width"
msgstr "Amplada"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:57
+#: src/app/main/ui/inspect/attributes/shadow.cljs:57
msgid "inspect.attributes.shadow"
msgstr "Ombra"
-#: src/app/main/ui/viewer/inspect/attributes/stroke.cljs:52
+#: src/app/main/ui/inspect/attributes/stroke.cljs:52
msgid "inspect.attributes.stroke"
msgstr "Traç"
@@ -1049,119 +1047,119 @@ msgstr "Sòlid"
msgid "inspect.attributes.stroke.width"
msgstr "Amplada"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:81, src/app/main/ui/viewer/inspect/attributes/text.cljs:194
+#: src/app/main/ui/inspect/attributes/text.cljs:83, src/app/main/ui/inspect/attributes/text.cljs:196
msgid "inspect.attributes.typography"
msgstr "Tipografia"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:89, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:299
+#: src/app/main/ui/inspect/attributes/text.cljs:91, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:302
msgid "inspect.attributes.typography.font-family"
msgstr "Família tipogràfica"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:107, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:317
+#: src/app/main/ui/inspect/attributes/text.cljs:109, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:320
msgid "inspect.attributes.typography.font-size"
msgstr "Mida de la lletra"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:98, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:333
+#: src/app/main/ui/inspect/attributes/text.cljs:100, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:336
msgid "inspect.attributes.typography.font-style"
msgstr "Estil de la lletra"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:134, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:386
+#: src/app/main/ui/inspect/attributes/text.cljs:136, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:389
msgid "inspect.attributes.typography.letter-spacing"
msgstr "Espaiat de la lletra"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:125, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:369
+#: src/app/main/ui/inspect/attributes/text.cljs:127, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:372
msgid "inspect.attributes.typography.line-height"
msgstr "Alçada de la línia"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:143
+#: src/app/main/ui/inspect/attributes/text.cljs:145
msgid "inspect.attributes.typography.text-decoration"
msgstr "Decoració del text"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:145
+#: src/app/main/ui/inspect/attributes/text.cljs:147
msgid "inspect.attributes.typography.text-decoration.none"
msgstr "Cap"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:146
+#: src/app/main/ui/inspect/attributes/text.cljs:148
msgid "inspect.attributes.typography.text-decoration.strikethrough"
msgstr "Barrat"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:147
+#: src/app/main/ui/inspect/attributes/text.cljs:149
msgid "inspect.attributes.typography.text-decoration.underline"
msgstr "Subratllat"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:156
+#: src/app/main/ui/inspect/attributes/text.cljs:158
msgid "inspect.attributes.typography.text-transform"
msgstr "Transformació del text"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:158, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:429
+#: src/app/main/ui/inspect/attributes/text.cljs:160, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:432
msgid "inspect.attributes.typography.text-transform.lowercase"
msgstr "Minúscules"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:159
+#: src/app/main/ui/inspect/attributes/text.cljs:161
msgid "inspect.attributes.typography.text-transform.none"
msgstr "Cap"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:160, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:425
+#: src/app/main/ui/inspect/attributes/text.cljs:162, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:428
msgid "inspect.attributes.typography.text-transform.titlecase"
msgstr "Inicials en majúscules"
-#: src/app/main/ui/viewer/inspect/attributes/text.cljs:161, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:419
+#: src/app/main/ui/inspect/attributes/text.cljs:163, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:422
msgid "inspect.attributes.typography.text-transform.uppercase"
msgstr "Majúscules"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:100
+#: src/app/main/ui/inspect/right_sidebar.cljs:105
msgid "inspect.tabs.code"
msgstr "Codi"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:124
+#: src/app/main/ui/inspect/right_sidebar.cljs:129
msgid "inspect.tabs.code.selected.circle"
msgstr "Cercle"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:125
+#: src/app/main/ui/inspect/right_sidebar.cljs:130
msgid "inspect.tabs.code.selected.component"
msgstr "Component"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:126
+#: src/app/main/ui/inspect/right_sidebar.cljs:131
msgid "inspect.tabs.code.selected.curve"
msgstr "Corba"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:127
+#: src/app/main/ui/inspect/right_sidebar.cljs:132
msgid "inspect.tabs.code.selected.frame"
msgstr "Tauler"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:128
+#: src/app/main/ui/inspect/right_sidebar.cljs:133
msgid "inspect.tabs.code.selected.group"
msgstr "Grup"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:129
+#: src/app/main/ui/inspect/right_sidebar.cljs:134
msgid "inspect.tabs.code.selected.image"
msgstr "Imatge"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:130
+#: src/app/main/ui/inspect/right_sidebar.cljs:135
msgid "inspect.tabs.code.selected.mask"
msgstr "Màscara"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:119
+#: src/app/main/ui/inspect/right_sidebar.cljs:124
msgid "inspect.tabs.code.selected.multiple"
msgstr "%s seleccionats"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:131
+#: src/app/main/ui/inspect/right_sidebar.cljs:136
msgid "inspect.tabs.code.selected.path"
msgstr "Camí"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:132
+#: src/app/main/ui/inspect/right_sidebar.cljs:137
msgid "inspect.tabs.code.selected.rect"
msgstr "Rectangle"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:133
+#: src/app/main/ui/inspect/right_sidebar.cljs:138
msgid "inspect.tabs.code.selected.svg-raw"
msgstr "SVG"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:134
+#: src/app/main/ui/inspect/right_sidebar.cljs:139
msgid "inspect.tabs.code.selected.text"
msgstr "Text"
-#: src/app/main/ui/viewer/inspect/right_sidebar.cljs:96
+#: src/app/main/ui/inspect/right_sidebar.cljs:101
msgid "inspect.tabs.info"
msgstr "Informació"
@@ -1173,7 +1171,7 @@ msgstr "Dreceres"
msgid "labels.accept"
msgstr "Acceptar"
-#: src/app/main/ui/dashboard/fonts.cljs:179
+#: src/app/main/ui/dashboard/fonts.cljs:180
msgid "labels.add-custom-font"
msgstr "Afegeix tipografia"
@@ -1181,7 +1179,7 @@ msgstr "Afegeix tipografia"
msgid "labels.admin"
msgstr "Administració"
-#: src/app/main/ui/workspace/tokens/context_menu.cljs:63, src/app/main/ui/workspace/tokens/context_menu.cljs:101, src/app/main/ui/workspace/tokens/token_pill.cljs:110
+#: src/app/main/ui/workspace/tokens/context_menu.cljs:66, src/app/main/ui/workspace/tokens/context_menu.cljs:100, src/app/main/ui/workspace/tokens/token_pill.cljs:118
msgid "labels.all"
msgstr "Tots"
@@ -1203,19 +1201,19 @@ msgstr ""
msgid "labels.bad-gateway.main-message"
msgstr "Error del servidor (Bad Gateway)"
-#: src/app/main/data/common.cljs:135, src/app/main/ui/dashboard/change_owner.cljs:66, src/app/main/ui/dashboard/import.cljs:489, src/app/main/ui/dashboard/team.cljs:916, src/app/main/ui/delete_shared.cljs:35, src/app/main/ui/exports/assets.cljs:161, src/app/main/ui/exports/files.cljs:192, src/app/main/ui/settings/access_tokens.cljs:177, src/app/main/ui/viewer/share_link.cljs:204, src/app/main/ui/workspace/sidebar/assets/groups.cljs:145, src/app/main/ui/workspace/tokens/form.cljs:506, src/app/main/ui/workspace/tokens/modals/themes.cljs:198
+#: src/app/main/data/common.cljs:135, src/app/main/ui/dashboard/change_owner.cljs:66, src/app/main/ui/dashboard/import.cljs:489, src/app/main/ui/dashboard/team.cljs:916, src/app/main/ui/delete_shared.cljs:35, src/app/main/ui/exports/assets.cljs:161, src/app/main/ui/exports/files.cljs:192, src/app/main/ui/settings/access_tokens.cljs:176, src/app/main/ui/viewer/share_link.cljs:204, src/app/main/ui/workspace/sidebar/assets/groups.cljs:145, src/app/main/ui/workspace/tokens/form.cljs:572, src/app/main/ui/workspace/tokens/modals/themes.cljs:234
msgid "labels.cancel"
msgstr "Cancel·la"
-#: src/app/main/ui/dashboard/comments.cljs:87, src/app/main/ui/dashboard/projects.cljs:99, src/app/main/ui/exports/files.cljs:210, src/app/main/ui/settings/access_tokens.cljs:172, src/app/main/ui/viewer/login.cljs:71, src/app/main/ui/viewer/share_link.cljs:175, src/app/main/ui/workspace/comments.cljs:125, src/app/main/ui/workspace/libraries.cljs:645, src/app/main/ui/workspace/sidebar/debug.cljs:40, src/app/main/ui/workspace/sidebar/layers.cljs:300, src/app/main/ui/workspace/sidebar.cljs:275, src/app/main/ui/workspace/tokens/modals/themes.cljs:396, src/app/main/ui/workspace/tokens/modals.cljs:64
+#: src/app/main/ui/dashboard/comments.cljs:102, src/app/main/ui/dashboard/projects.cljs:99, src/app/main/ui/exports/files.cljs:210, src/app/main/ui/settings/access_tokens.cljs:171, src/app/main/ui/viewer/login.cljs:71, src/app/main/ui/viewer/share_link.cljs:175, src/app/main/ui/workspace/comments.cljs:128, src/app/main/ui/workspace/libraries.cljs:627, src/app/main/ui/workspace/sidebar/debug.cljs:40, src/app/main/ui/workspace/sidebar/layers.cljs:300, src/app/main/ui/workspace/sidebar.cljs:276, src/app/main/ui/workspace/tokens/modals/themes.cljs:59, src/app/main/ui/workspace/tokens/modals/themes.cljs:166, src/app/main/ui/workspace/tokens/modals/themes.cljs:446, src/app/main/ui/workspace/tokens/modals.cljs:64
msgid "labels.close"
msgstr "Tanca"
-#: src/app/main/ui/viewer/comments.cljs:70, src/app/main/ui/workspace/comments.cljs:123
+#: src/app/main/ui/viewer/comments.cljs:71, src/app/main/ui/workspace/comments.cljs:126
msgid "labels.comments"
msgstr "Comentaris"
-#: src/app/main/ui/dashboard/sidebar.cljs:1016, src/app/main/ui/workspace/main_menu.cljs:114
+#: src/app/main/ui/dashboard/sidebar.cljs:1017, src/app/main/ui/workspace/main_menu.cljs:114
msgid "labels.community"
msgstr "Comunitat"
@@ -1223,7 +1221,7 @@ msgstr "Comunitat"
msgid "labels.confirm-password"
msgstr "Confirmeu la contrasenya"
-#: src/app/main/ui/dashboard/import.cljs:495, src/app/main/ui/exports/files.cljs:197, src/app/main/ui/onboarding/newsletter.cljs:101
+#: src/app/main/ui/dashboard/import.cljs:495, src/app/main/ui/exports/files.cljs:197, src/app/main/ui/onboarding/newsletter.cljs:106
msgid "labels.continue"
msgstr "Continua"
@@ -1239,7 +1237,7 @@ msgstr "Podeu continuar amb un compte de Penpot"
msgid "labels.copy-invitation-link"
msgstr "Copia l'enllaç"
-#: src/app/main/ui/workspace/sidebar/assets/groups.cljs:153, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:190
+#: src/app/main/ui/workspace/sidebar/assets/groups.cljs:153, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:197
msgid "labels.create"
msgstr "Crea"
@@ -1259,15 +1257,15 @@ msgstr "Tipografies personalitzades"
msgid "labels.dashboard"
msgstr "Tauler"
-#: src/app/main/ui/dashboard/file_menu.cljs:326, src/app/main/ui/dashboard/fonts.cljs:259, src/app/main/ui/dashboard/fonts.cljs:335, src/app/main/ui/dashboard/fonts.cljs:349, src/app/main/ui/dashboard/project_menu.cljs:115, src/app/main/ui/dashboard/team.cljs:952, src/app/main/ui/settings/access_tokens.cljs:198, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:209, src/app/main/ui/workspace/sidebar/versions.cljs:136, src/app/main/ui/workspace/tokens/form.cljs:500, src/app/main/ui/workspace/tokens/modals/themes.cljs:365, src/app/main/ui/workspace/tokens/sets_context_menu.cljs:52
+#: src/app/main/ui/dashboard/file_menu.cljs:326, src/app/main/ui/dashboard/fonts.cljs:261, src/app/main/ui/dashboard/fonts.cljs:337, src/app/main/ui/dashboard/fonts.cljs:351, src/app/main/ui/dashboard/project_menu.cljs:115, src/app/main/ui/dashboard/team.cljs:952, src/app/main/ui/settings/access_tokens.cljs:197, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:216, src/app/main/ui/workspace/sidebar/versions.cljs:136, src/app/main/ui/workspace/tokens/form.cljs:565, src/app/main/ui/workspace/tokens/modals/themes.cljs:414, src/app/main/ui/workspace/tokens/sets_context_menu.cljs:56
msgid "labels.delete"
msgstr "Elimina"
-#: src/app/main/ui/comments.cljs:907
+#: src/app/main/ui/comments.cljs:976
msgid "labels.delete-comment"
msgstr "Elimina el comentari"
-#: src/app/main/ui/comments.cljs:830
+#: src/app/main/ui/comments.cljs:899
msgid "labels.delete-comment-thread"
msgstr "Elimina el fil"
@@ -1279,11 +1277,11 @@ msgstr "Esborra invitació"
msgid "labels.delete-multi-files"
msgstr "Elimina %s fitxers"
-#: src/app/main/ui/dashboard/file_menu.cljs:29, src/app/main/ui/dashboard/files.cljs:79, src/app/main/ui/dashboard/files.cljs:177, src/app/main/ui/dashboard/projects.cljs:227, src/app/main/ui/dashboard/projects.cljs:231, src/app/main/ui/dashboard/sidebar.cljs:814
+#: src/app/main/ui/dashboard/file_menu.cljs:29, src/app/main/ui/dashboard/files.cljs:79, src/app/main/ui/dashboard/files.cljs:177, src/app/main/ui/dashboard/projects.cljs:228, src/app/main/ui/dashboard/projects.cljs:232, src/app/main/ui/dashboard/sidebar.cljs:814
msgid "labels.drafts"
msgstr "Esborranys"
-#: src/app/main/ui/comments.cljs:903, src/app/main/ui/dashboard/fonts.cljs:256, src/app/main/ui/dashboard/team.cljs:950, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:205, src/app/main/ui/workspace/tokens/sidebar.cljs:198
+#: src/app/main/ui/comments.cljs:972, src/app/main/ui/dashboard/fonts.cljs:258, src/app/main/ui/dashboard/team.cljs:950, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:212, src/app/main/ui/workspace/tokens/sidebar.cljs:197
msgid "labels.edit"
msgstr "Edita"
@@ -1299,7 +1297,7 @@ msgstr "Editor"
msgid "labels.expired-invitation"
msgstr "Ha caducat"
-#: src/app/main/ui/exports/assets.cljs:170, src/app/main/ui/workspace/tokens/sidebar.cljs:359
+#: src/app/main/ui/exports/assets.cljs:170, src/app/main/ui/workspace/tokens/sidebar.cljs:418
msgid "labels.export"
msgstr "Exporta"
@@ -1311,7 +1309,7 @@ msgstr "Opinions desactivades"
msgid "labels.feedback-sent"
msgstr "S'ha enviat l'opinió"
-#: src/app/main/ui/dashboard/fonts.cljs:422
+#: src/app/main/ui/dashboard/fonts.cljs:424
msgid "labels.font-family"
msgstr "Família tipogràfica"
@@ -1319,19 +1317,19 @@ msgstr "Família tipogràfica"
msgid "labels.font-providers"
msgstr "Proveïdors de tipografies"
-#: src/app/main/ui/dashboard/fonts.cljs:423
+#: src/app/main/ui/dashboard/fonts.cljs:425
msgid "labels.font-variants"
msgstr "Estils"
-#: src/app/main/ui/dashboard/fonts.cljs:54, src/app/main/ui/dashboard/sidebar.cljs:834
+#: src/app/main/ui/dashboard/fonts.cljs:55, src/app/main/ui/dashboard/sidebar.cljs:834
msgid "labels.fonts"
msgstr "Tipografies"
-#: src/app/main/ui/dashboard/sidebar.cljs:1046, src/app/main/ui/workspace/main_menu.cljs:146
+#: src/app/main/ui/dashboard/sidebar.cljs:1047, src/app/main/ui/workspace/main_menu.cljs:146
msgid "labels.github-repo"
msgstr "Repositori Github"
-#: src/app/main/ui/dashboard/sidebar.cljs:1063, src/app/main/ui/settings/sidebar.cljs:125, src/app/main/ui/workspace/main_menu.cljs:175
+#: src/app/main/ui/dashboard/sidebar.cljs:1064, src/app/main/ui/settings/sidebar.cljs:125, src/app/main/ui/workspace/main_menu.cljs:175
msgid "labels.give-feedback"
msgstr "Envia opinions"
@@ -1339,15 +1337,15 @@ msgstr "Envia opinions"
msgid "labels.go-back"
msgstr "Enrere"
-#: src/app/main/ui/dashboard/sidebar.cljs:1009, src/app/main/ui/workspace/main_menu.cljs:106, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1079, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1104, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1290
+#: src/app/main/ui/dashboard/sidebar.cljs:1010, src/app/main/ui/workspace/main_menu.cljs:106, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1088, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1113, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1299
msgid "labels.help-center"
msgstr "Centre d'ajuda"
-#: src/app/main/ui/viewer/comments.cljs:103, src/app/main/ui/workspace/comments.cljs:72
+#: src/app/main/ui/viewer/comments.cljs:104, src/app/main/ui/workspace/comments.cljs:73
msgid "labels.hide-resolved-comments"
msgstr "Amaga els comentaris resolts"
-#: src/app/main/ui/dashboard/fonts.cljs:420
+#: src/app/main/ui/dashboard/fonts.cljs:422
msgid "labels.installed-fonts"
msgstr "Tipografies instal·lades"
@@ -1369,7 +1367,7 @@ msgstr "Invitacions"
msgid "labels.language"
msgstr "Llengua"
-#: src/app/main/ui/dashboard/sidebar.cljs:1039, src/app/main/ui/workspace/main_menu.cljs:138
+#: src/app/main/ui/dashboard/sidebar.cljs:1040, src/app/main/ui/workspace/main_menu.cljs:138
msgid "labels.libraries-and-templates"
msgstr "Biblioteques i plantilles"
@@ -1377,7 +1375,7 @@ msgstr "Biblioteques i plantilles"
msgid "labels.log-or-sign"
msgstr "Inicia sessió o registra'm"
-#: src/app/main/ui/dashboard/sidebar.cljs:1071
+#: src/app/main/ui/dashboard/sidebar.cljs:1072
msgid "labels.logout"
msgstr "Tanca la sessió"
@@ -1393,7 +1391,7 @@ msgstr "Membres"
msgid "labels.new-password"
msgstr "Contrasenya nova"
-#: src/app/main/ui/dashboard/comments.cljs:106, src/app/main/ui/workspace/comments.cljs:161
+#: src/app/main/ui/dashboard/comments.cljs:121, src/app/main/ui/workspace/comments.cljs:164
msgid "labels.no-comments-available"
msgstr "No teniu notificacions de comentaris pendents"
@@ -1419,7 +1417,7 @@ msgstr ""
msgid "labels.not-found.main-message"
msgstr "Vaja!"
-#: src/app/main/ui/dashboard/projects.cljs:238, src/app/main/ui/dashboard/team.cljs:1147
+#: src/app/main/ui/dashboard/projects.cljs:239, src/app/main/ui/dashboard/team.cljs:1147
msgid "labels.num-of-files"
msgid_plural "labels.num-of-files"
msgstr[0] "1 fitxer"
@@ -1470,7 +1468,7 @@ msgstr "Perfil"
msgid "labels.projects"
msgstr "Projectes"
-#: src/app/main/ui/dashboard/sidebar.cljs:1029, src/app/main/ui/settings/sidebar.cljs:118, src/app/main/ui/workspace/main_menu.cljs:130
+#: src/app/main/ui/dashboard/sidebar.cljs:1030, src/app/main/ui/settings/sidebar.cljs:118, src/app/main/ui/workspace/main_menu.cljs:130
msgid "labels.release-notes"
msgstr "Notes de la versió"
@@ -1488,7 +1486,7 @@ msgstr "Elimina"
msgid "labels.remove-member"
msgstr "Elimina membre"
-#: src/app/main/ui/dashboard/file_menu.cljs:278, src/app/main/ui/dashboard/project_menu.cljs:88, src/app/main/ui/dashboard/sidebar.cljs:548, src/app/main/ui/workspace/sidebar/assets/groups.cljs:153, src/app/main/ui/workspace/sidebar/versions.cljs:130, src/app/main/ui/workspace/tokens/sets_context_menu.cljs:51
+#: src/app/main/ui/dashboard/file_menu.cljs:278, src/app/main/ui/dashboard/project_menu.cljs:88, src/app/main/ui/dashboard/sidebar.cljs:548, src/app/main/ui/workspace/sidebar/assets/groups.cljs:153, src/app/main/ui/workspace/sidebar/versions.cljs:130, src/app/main/ui/workspace/tokens/sets_context_menu.cljs:55
msgid "labels.rename"
msgstr "Canvia el nom"
@@ -1508,15 +1506,15 @@ msgstr "Tornar a intentar-ho"
msgid "labels.role"
msgstr "Rol"
-#: src/app/main/ui/dashboard/fonts.cljs:385, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:191, src/app/main/ui/workspace/tokens/form.cljs:510
+#: src/app/main/ui/dashboard/fonts.cljs:387, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:198, src/app/main/ui/workspace/tokens/form.cljs:577
msgid "labels.save"
msgstr "Desa"
-#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:425
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:506
msgid "labels.search"
msgstr "Cerca"
-#: src/app/main/ui/dashboard/fonts.cljs:425
+#: src/app/main/ui/dashboard/fonts.cljs:427
msgid "labels.search-font"
msgstr "Cerca tipografia"
@@ -1552,15 +1550,15 @@ msgstr "Comparteix prototip"
msgid "labels.shared-libraries"
msgstr "Biblioteques compartides"
-#: src/app/main/ui/viewer/comments.cljs:82, src/app/main/ui/workspace/comments.cljs:54, src/app/main/ui/workspace/comments.cljs:134
+#: src/app/main/ui/viewer/comments.cljs:83, src/app/main/ui/workspace/comments.cljs:55, src/app/main/ui/workspace/comments.cljs:137
msgid "labels.show-all-comments"
msgstr "Mostra tots els comentaris"
-#: src/app/main/ui/viewer/comments.cljs:115
+#: src/app/main/ui/viewer/comments.cljs:116
msgid "labels.show-comments-list"
msgstr "Mostra la llista de comentaris"
-#: src/app/main/ui/viewer/comments.cljs:91, src/app/main/ui/workspace/comments.cljs:60, src/app/main/ui/workspace/comments.cljs:135
+#: src/app/main/ui/viewer/comments.cljs:92, src/app/main/ui/workspace/comments.cljs:61, src/app/main/ui/workspace/comments.cljs:138
msgid "labels.show-your-comments"
msgstr "Mostra només els meus comentaris"
@@ -1568,7 +1566,7 @@ msgstr "Mostra només els meus comentaris"
msgid "labels.status"
msgstr "Estat"
-#: src/app/main/ui/dashboard/sidebar.cljs:1023, src/app/main/ui/workspace/main_menu.cljs:122
+#: src/app/main/ui/dashboard/sidebar.cljs:1024, src/app/main/ui/workspace/main_menu.cljs:122
msgid "labels.tutorials"
msgstr "Tutorials"
@@ -1580,15 +1578,15 @@ msgstr "Actualitza"
msgid "labels.update-team"
msgstr "Actualitza l'equip"
-#: src/app/main/ui/dashboard/fonts.cljs:245
+#: src/app/main/ui/dashboard/fonts.cljs:247
msgid "labels.upload"
msgstr "Puja"
-#: src/app/main/ui/dashboard/fonts.cljs:173
+#: src/app/main/ui/dashboard/fonts.cljs:174
msgid "labels.upload-custom-fonts"
msgstr "Pugeu tipografies personalitzades"
-#: src/app/main/ui/dashboard/fonts.cljs:244
+#: src/app/main/ui/dashboard/fonts.cljs:246
msgid "labels.uploading"
msgstr "S'està pujant…"
@@ -1600,7 +1598,7 @@ msgstr "Només lectura"
msgid "labels.viewer"
msgstr "Visor"
-#: src/app/main/ui/comments.cljs:743
+#: src/app/main/ui/comments.cljs:818
msgid "labels.write-new-comment"
msgstr "Escriu un comentari nou"
@@ -1608,11 +1606,11 @@ msgstr "Escriu un comentari nou"
msgid "labels.you"
msgstr "(jo)"
-#: src/app/main/ui/dashboard/sidebar.cljs:999
+#: src/app/main/ui/dashboard/sidebar.cljs:1000
msgid "labels.your-account"
msgstr "El meu compte"
-#: src/app/main/data/workspace/media.cljs:274, src/app/main/ui/components/color_bullet.cljs:34, src/app/main/ui/components/color_bullet.cljs:47, src/app/main/ui/ds/utilities/swatch.cljs:40, src/app/main/ui/ds/utilities/swatch.cljs:53, src/app/main/ui/viewer/inspect/attributes/common.cljs:66, src/app/main/ui/workspace/colorpicker.cljs:247, src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs:239
+#: src/app/main/data/workspace/media.cljs:274, src/app/main/ui/components/color_bullet.cljs:34, src/app/main/ui/components/color_bullet.cljs:47, src/app/main/ui/ds/utilities/swatch.cljs:40, src/app/main/ui/ds/utilities/swatch.cljs:53, src/app/main/ui/inspect/attributes/common.cljs:66, src/app/main/ui/workspace/colorpicker.cljs:243, src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs:239
msgid "media.image"
msgstr "Imatge"
@@ -1681,17 +1679,17 @@ msgstr "Si suprimiu el compte, perdreu tots els vostres projectes i arxius actua
msgid "modals.delete-account.title"
msgstr "Segur que voleu eliminar el compte?"
-#: src/app/main/ui/comments.cljs:800
+#: src/app/main/ui/comments.cljs:869
msgid "modals.delete-comment-thread.accept"
msgstr "Elimina la conversa"
-#: src/app/main/ui/comments.cljs:799
+#: src/app/main/ui/comments.cljs:868
msgid "modals.delete-comment-thread.message"
msgstr ""
"Segur que voleu eliminar aquesta conversa? S'eliminaran tots els comentaris "
"del fil."
-#: src/app/main/ui/comments.cljs:798
+#: src/app/main/ui/comments.cljs:867
msgid "modals.delete-comment-thread.title"
msgstr "Elimina la conversa"
@@ -1719,31 +1717,31 @@ msgstr "Segur que voleu eliminar %s fitxers?"
msgid "modals.delete-file-multi-confirm.title"
msgstr "S'estan eliminant %s fitxers"
-#: src/app/main/ui/dashboard/fonts.cljs:348
+#: src/app/main/ui/dashboard/fonts.cljs:350
msgid "modals.delete-font-variant.message"
msgstr ""
"Segur que voleu eliminar aquest estil de lletra? No es carregarà si "
"s'utilitza en un fitxer."
-#: src/app/main/ui/dashboard/fonts.cljs:347
+#: src/app/main/ui/dashboard/fonts.cljs:349
msgid "modals.delete-font-variant.title"
msgstr "S'està eliminant l'estil de tipografia"
-#: src/app/main/ui/dashboard/fonts.cljs:334
+#: src/app/main/ui/dashboard/fonts.cljs:336
msgid "modals.delete-font.message"
msgstr ""
"Segur que voleu eliminar aquesta tipografia? No es carregarà si s'utilitza "
"en un fitxer."
-#: src/app/main/ui/dashboard/fonts.cljs:333
+#: src/app/main/ui/dashboard/fonts.cljs:335
msgid "modals.delete-font.title"
msgstr "S'està eliminant la tipografia"
-#: src/app/main/ui/workspace/context_menu.cljs:627, src/app/main/ui/workspace/sidebar/sitemap.cljs:71
+#: src/app/main/ui/workspace/context_menu.cljs:643, src/app/main/ui/workspace/sidebar/sitemap.cljs:71
msgid "modals.delete-page.body"
msgstr "Segur que voleu eliminar la pàgina?"
-#: src/app/main/ui/workspace/context_menu.cljs:626, src/app/main/ui/workspace/sidebar/sitemap.cljs:70
+#: src/app/main/ui/workspace/context_menu.cljs:642, src/app/main/ui/workspace/sidebar/sitemap.cljs:70
msgid "modals.delete-page.title"
msgstr "Elimina la pàgina"
@@ -1883,7 +1881,7 @@ msgstr ""
msgid "modals.promote-owner-confirm.title"
msgstr "Ascendeix a propietari"
-#: src/app/main/ui/workspace/libraries.cljs:273
+#: src/app/main/ui/workspace/libraries.cljs:270
msgid "modals.publish-empty-library.accept"
msgstr "Publica"
@@ -1920,21 +1918,21 @@ msgstr ""
msgid "modals.update-remote-component-in-bulk.message"
msgstr "Actualitza els components en una biblioteca compartida"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:393
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:403
msgid "modals.update-remote-component.accept"
msgstr "Actualitza"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:392
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:402
msgid "modals.update-remote-component.cancel"
msgstr "Cancel·la"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:391
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:401
msgid "modals.update-remote-component.hint"
msgstr ""
"Esteu a punt d'actualitzar un component d'una biblioteca compartida. Això "
"pot afectar altres fitxers que l'usen."
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:390
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:400
msgid "modals.update-remote-component.message"
msgstr "Actualitza un component en una biblioteca compartida"
@@ -1980,17 +1978,17 @@ msgstr "Convida membres"
msgid "onboarding.newsletter.accept"
msgstr "Sí, subscriu-m'hi"
-#: src/app/main/ui/onboarding/newsletter.cljs:40
+#: src/app/main/ui/onboarding/newsletter.cljs:42
msgid "onboarding.newsletter.acceptance-message"
msgstr ""
"S'ha enviat la sol·licitud de subscripció. Us enviarem un correu electrònic "
"per confirmar-ho."
-#: src/app/main/ui/onboarding/newsletter.cljs:95
+#: src/app/main/ui/onboarding/newsletter.cljs:100
msgid "onboarding.newsletter.policy"
msgstr "Política de privacitat."
-#: src/app/main/ui/onboarding/newsletter.cljs:60
+#: src/app/main/ui/onboarding/newsletter.cljs:65
msgid "onboarding.newsletter.title"
msgstr "Voleu rebre les novetats de Penpot?"
@@ -2014,7 +2012,7 @@ msgstr "Penpot"
msgid "profile.recovery.go-to-login"
msgstr "Vés a l'inici de sessió"
-#: src/app/main/ui/viewer/inspect/exports.cljs:147, src/app/main/ui/workspace/sidebar/options/menus/border_radius.cljs:90, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:622, src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs:137, src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs:148, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:196, src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:162, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:355, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:366, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:386, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:397, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:413, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:315, src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs:182, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:380, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:397, src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs:247, src/app/main/ui/workspace/sidebar/options/rows/stroke_row.cljs:172
+#: src/app/main/ui/inspect/exports.cljs:148, src/app/main/ui/workspace/sidebar/options/menus/border_radius.cljs:90, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:712, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:831, src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs:137, src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs:148, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:197, src/app/main/ui/workspace/sidebar/options/menus/fill.cljs:162, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:342, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:357, src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:53, src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs:54, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:352, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:363, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:383, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:394, src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:410, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:302, src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs:182, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:383, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:400, src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs:247, src/app/main/ui/workspace/sidebar/options/rows/stroke_row.cljs:173
msgid "settings.multiple"
msgstr "Mixt"
@@ -2184,7 +2182,7 @@ msgstr "Crea nou"
msgid "shortcuts.cut"
msgstr "Retalla"
-#: src/app/main/ui/workspace/right_header.cljs:116, src/app/main/ui/workspace/sidebar/shortcuts.cljs:98
+#: src/app/main/ui/workspace/right_header.cljs:84, src/app/main/ui/workspace/sidebar/shortcuts.cljs:98
msgid "shortcuts.decrease-zoom"
msgstr "Disminueix el zoom"
@@ -2276,7 +2274,7 @@ msgstr "Distribueix horitzontalment"
msgid "shortcuts.hide-ui"
msgstr "Mostra/Amaga la interfície"
-#: src/app/main/ui/workspace/right_header.cljs:121, src/app/main/ui/workspace/sidebar/shortcuts.cljs:123
+#: src/app/main/ui/workspace/right_header.cljs:89, src/app/main/ui/workspace/sidebar/shortcuts.cljs:123
msgid "shortcuts.increase-zoom"
msgstr "Amplia"
@@ -2560,15 +2558,15 @@ msgstr "Amplia a la selecció"
msgid "title.dashboard.files"
msgstr "%s - Penpot"
-#: src/app/main/ui/dashboard/fonts.cljs:39
+#: src/app/main/ui/dashboard/fonts.cljs:40
msgid "title.dashboard.font-providers"
msgstr "Proveïdors de tipografies - %s - Penpot"
-#: src/app/main/ui/dashboard/fonts.cljs:38
+#: src/app/main/ui/dashboard/fonts.cljs:39
msgid "title.dashboard.fonts"
msgstr "Tipografies - %s - Penpot"
-#: src/app/main/ui/dashboard/projects.cljs:347
+#: src/app/main/ui/dashboard/projects.cljs:350
msgid "title.dashboard.projects"
msgstr "Projectes - %s - Penpot"
@@ -2576,7 +2574,7 @@ msgstr "Projectes - %s - Penpot"
msgid "title.dashboard.search"
msgstr "Cerca - %s - Penpot"
-#: src/app/main/ui/dashboard/libraries.cljs:42
+#: src/app/main/ui/dashboard/libraries.cljs:57
msgid "title.dashboard.shared-libraries"
msgstr "Biblioteques compartides - %s - Penpot"
@@ -2616,7 +2614,7 @@ msgstr "Configuració - %s - Penpot"
msgid "title.viewer"
msgstr "%s - Visor - Penpot"
-#: src/app/main/ui/workspace.cljs:202
+#: src/app/main/ui/workspace.cljs:188
msgid "title.workspace"
msgstr "%s - Penpot"
@@ -2713,15 +2711,15 @@ msgstr "Alinea la part superior (%s)"
msgid "workspace.assets.assets"
msgstr "Recursos"
-#: src/app/main/ui/workspace/sidebar/assets.cljs:146
+#: src/app/main/ui/workspace/sidebar/assets.cljs:144
msgid "workspace.assets.box-filter-all"
msgstr "Tots els recursos"
-#: src/app/main/ui/dashboard/grid.cljs:147, src/app/main/ui/dashboard/grid.cljs:179, src/app/main/ui/workspace/sidebar/assets/colors.cljs:486, src/app/main/ui/workspace/sidebar/assets.cljs:158
+#: src/app/main/ui/dashboard/grid.cljs:148, src/app/main/ui/dashboard/grid.cljs:180, src/app/main/ui/workspace/sidebar/assets/colors.cljs:486, src/app/main/ui/workspace/sidebar/assets.cljs:156
msgid "workspace.assets.colors"
msgstr "Colors"
-#: src/app/main/ui/dashboard/grid.cljs:143, src/app/main/ui/dashboard/grid.cljs:158, src/app/main/ui/workspace/sidebar/assets/components.cljs:489, src/app/main/ui/workspace/sidebar/assets.cljs:149
+#: src/app/main/ui/dashboard/grid.cljs:144, src/app/main/ui/dashboard/grid.cljs:159, src/app/main/ui/workspace/sidebar/assets/components.cljs:499, src/app/main/ui/workspace/sidebar/assets.cljs:147
msgid "workspace.assets.components"
msgstr "Components"
@@ -2735,11 +2733,11 @@ msgstr ""
"Els elements s'anomenaran automàticament com a \"nom del grup / nom de "
"l'element\""
-#: src/app/main/ui/workspace/context_menu.cljs:636, src/app/main/ui/workspace/sidebar/assets/colors.cljs:250, src/app/main/ui/workspace/sidebar/assets/components.cljs:554, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:426, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:442
+#: src/app/main/ui/workspace/context_menu.cljs:652, src/app/main/ui/workspace/sidebar/assets/colors.cljs:250, src/app/main/ui/workspace/sidebar/assets/components.cljs:564, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:426, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:442
msgid "workspace.assets.delete"
msgstr "Elimina"
-#: src/app/main/ui/workspace/context_menu.cljs:641, src/app/main/ui/workspace/sidebar/assets/components.cljs:549
+#: src/app/main/ui/workspace/context_menu.cljs:657, src/app/main/ui/workspace/sidebar/assets/components.cljs:559
msgid "workspace.assets.duplicate"
msgstr "Duplica"
@@ -2747,11 +2745,11 @@ msgstr "Duplica"
msgid "workspace.assets.edit"
msgstr "Edita"
-#: src/app/main/ui/workspace/sidebar/assets/graphics.cljs:386, src/app/main/ui/workspace/sidebar/assets.cljs:154
+#: src/app/main/ui/workspace/sidebar/assets/graphics.cljs:386, src/app/main/ui/workspace/sidebar/assets.cljs:152
msgid "workspace.assets.graphics"
msgstr "Gràfics"
-#: src/app/main/ui/workspace/sidebar/assets/colors.cljs:254, src/app/main/ui/workspace/sidebar/assets/components.cljs:558, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:430, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:447
+#: src/app/main/ui/workspace/sidebar/assets/colors.cljs:254, src/app/main/ui/workspace/sidebar/assets/components.cljs:568, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:430, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:447
msgid "workspace.assets.group"
msgstr "Agrupa"
@@ -2759,19 +2757,15 @@ msgstr "Agrupa"
msgid "workspace.assets.group-name"
msgstr "Nom del grup"
-#: src/app/main/ui/workspace/sidebar/assets.cljs:186
-msgid "workspace.assets.libraries"
-msgstr "Biblioteques"
-
-#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:106, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:336
+#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:107, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:417
msgid "workspace.assets.local-library"
msgstr "llibreria local"
-#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:320
+#: src/app/main/ui/workspace/sidebar/assets/file_library.cljs:321
msgid "workspace.assets.not-found"
msgstr "No s'han trobat recursos"
-#: src/app/main/ui/workspace/context_menu.cljs:639, src/app/main/ui/workspace/sidebar/assets/colors.cljs:242, src/app/main/ui/workspace/sidebar/assets/components.cljs:543, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:423, src/app/main/ui/workspace/sidebar/assets/groups.cljs:62, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:433
+#: src/app/main/ui/workspace/context_menu.cljs:655, src/app/main/ui/workspace/sidebar/assets/colors.cljs:242, src/app/main/ui/workspace/sidebar/assets/components.cljs:553, src/app/main/ui/workspace/sidebar/assets/graphics.cljs:423, src/app/main/ui/workspace/sidebar/assets/groups.cljs:62, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:433
msgid "workspace.assets.rename"
msgstr "Canvia el nom"
@@ -2779,7 +2773,7 @@ msgstr "Canvia el nom"
msgid "workspace.assets.rename-group"
msgstr "Canvia el nom del grup"
-#: src/app/main/ui/workspace/sidebar/assets.cljs:192
+#: src/app/main/ui/workspace/sidebar/assets.cljs:182
msgid "workspace.assets.search"
msgstr "Cerca recursos"
@@ -2790,7 +2784,7 @@ msgid_plural "workspace.assets.selected-count"
msgstr[0] "%s element seleccionat"
msgstr[1] "%s elements seleccionats"
-#: src/app/main/ui/dashboard/grid.cljs:151, src/app/main/ui/dashboard/grid.cljs:206, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:396, src/app/main/ui/workspace/sidebar/assets.cljs:162
+#: src/app/main/ui/dashboard/grid.cljs:152, src/app/main/ui/dashboard/grid.cljs:207, src/app/main/ui/workspace/sidebar/assets/typographies.cljs:396, src/app/main/ui/workspace/sidebar/assets.cljs:160
msgid "workspace.assets.typography"
msgstr "Tipografies"
@@ -2799,31 +2793,31 @@ msgstr "Tipografies"
msgid "workspace.assets.typography.font-id"
msgstr "Tipografia"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:517
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:520
msgid "workspace.assets.typography.font-size"
msgstr "Mida"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:513
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:516
msgid "workspace.assets.typography.font-variant-id"
msgstr "Variant"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:535
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:538
msgid "workspace.assets.typography.go-to-edit"
msgstr "Vés al fitxer de la biblioteca d'estils per a editar-lo"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:525
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:528
msgid "workspace.assets.typography.letter-spacing"
msgstr "Espaiat de la lletra"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:521
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:524
msgid "workspace.assets.typography.line-height"
msgstr "Alçada de la línia"
-#: src/app/main/ui/dashboard/grid.cljs:216, src/app/main/ui/workspace/libraries.cljs:562, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:476, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:501, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:608, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:627
+#: src/app/main/ui/dashboard/grid.cljs:217, src/app/main/ui/workspace/libraries.cljs:546, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:479, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:504, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:611, src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:630
msgid "workspace.assets.typography.sample"
msgstr "Ag"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:529
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:532
msgid "workspace.assets.typography.text-transform"
msgstr "Transforma el text"
@@ -2835,11 +2829,11 @@ msgstr "Desagrupa"
msgid "workspace.focus.focus-mode"
msgstr "Mode d'enfocament"
-#: src/app/main/ui/workspace/context_menu.cljs:378, src/app/main/ui/workspace/context_menu.cljs:663
+#: src/app/main/ui/workspace/context_menu.cljs:380, src/app/main/ui/workspace/context_menu.cljs:679
msgid "workspace.focus.focus-off"
msgstr "Enfocament apagat"
-#: src/app/main/ui/workspace/context_menu.cljs:377
+#: src/app/main/ui/workspace/context_menu.cljs:379
msgid "workspace.focus.focus-on"
msgstr "Enfocament actiu"
@@ -2973,29 +2967,28 @@ msgstr "Canvia al mode clar"
msgid "workspace.header.menu.undo"
msgstr "Desfés"
-#: src/app/main/ui/viewer/header.cljs:98, src/app/main/ui/workspace/right_header.cljs:126
+#: src/app/main/ui/viewer/header.cljs:98, src/app/main/ui/workspace/right_header.cljs:94
msgid "workspace.header.reset-zoom"
msgstr "Restableix"
-#: src/app/main/ui/workspace/header.cljs
-#, unused
+#: src/app/main/ui/workspace/left_header.cljs:127
msgid "workspace.header.save-error"
msgstr "S'ha produït un error en desar"
-#: src/app/main/ui/workspace/right_header.cljs:58
+#: src/app/main/ui/workspace/left_header.cljs:126
msgid "workspace.header.saved"
msgstr "Desat"
-#: src/app/main/ui/workspace/header.cljs
-#, unused
+#: src/app/main/ui/workspace/left_header.cljs:124, src/app/main/ui/workspace/left_header.cljs:125
msgid "workspace.header.saving"
msgstr "S'està desant"
#: src/app/main/ui/workspace/right_header.cljs:48, src/app/main/ui/workspace/right_header.cljs:53
+#, unused
msgid "workspace.header.unsaved"
msgstr "Canvis sense desar"
-#: src/app/main/ui/workspace/right_header.cljs:260
+#: src/app/main/ui/workspace/right_header.cljs:226
msgid "workspace.header.viewer"
msgstr "Visor (%s)"
@@ -3007,7 +3000,7 @@ msgstr "Emplena - Amplia per a omplir"
msgid "workspace.header.zoom-fit"
msgstr "Ajusta - Redueix per a encaixar"
-#: src/app/main/ui/workspace/right_header.cljs:129
+#: src/app/main/ui/workspace/right_header.cljs:97
msgid "workspace.header.zoom-fit-all"
msgstr "Apropa per a omplir-ho tot"
@@ -3015,7 +3008,7 @@ msgstr "Apropa per a omplir-ho tot"
msgid "workspace.header.zoom-full-screen"
msgstr "Pantalla completa"
-#: src/app/main/ui/workspace/right_header.cljs:136
+#: src/app/main/ui/workspace/right_header.cljs:104
msgid "workspace.header.zoom-selected"
msgstr "Apropa la selecció"
@@ -3028,7 +3021,7 @@ msgstr "Fet"
msgid "workspace.libraries.add"
msgstr "Afegeix"
-#: src/app/main/ui/workspace/libraries.cljs:107, src/app/main/ui/workspace/libraries.cljs:133
+#: src/app/main/ui/workspace/libraries.cljs:106, src/app/main/ui/workspace/libraries.cljs:132
msgid "workspace.libraries.colors"
msgstr "%s colors"
@@ -3050,31 +3043,31 @@ msgstr "Colors recents"
msgid "workspace.libraries.colors.rgb-complementary"
msgstr "Complementari d'RGB"
-#: src/app/main/ui/workspace/colorpicker.cljs:344
+#: src/app/main/ui/workspace/colorpicker.cljs:340
msgid "workspace.libraries.colors.rgba"
msgstr "RGBA"
-#: src/app/main/ui/workspace/colorpicker.cljs:515
+#: src/app/main/ui/workspace/colorpicker.cljs:511
msgid "workspace.libraries.colors.save-color"
msgstr "Desa l'estil de color"
-#: src/app/main/ui/workspace/libraries.cljs:101, src/app/main/ui/workspace/libraries.cljs:125
+#: src/app/main/ui/workspace/libraries.cljs:100, src/app/main/ui/workspace/libraries.cljs:124
msgid "workspace.libraries.components"
msgstr "%s components"
-#: src/app/main/ui/workspace/libraries.cljs:300
+#: src/app/main/ui/workspace/libraries.cljs:297
msgid "workspace.libraries.file-library"
msgstr "Biblioteca del fitxer"
-#: src/app/main/ui/workspace/libraries.cljs:104, src/app/main/ui/workspace/libraries.cljs:129
+#: src/app/main/ui/workspace/libraries.cljs:103, src/app/main/ui/workspace/libraries.cljs:128
msgid "workspace.libraries.graphics"
msgstr "%s gràfics"
-#: src/app/main/ui/workspace/libraries.cljs:294
+#: src/app/main/ui/workspace/libraries.cljs:291
msgid "workspace.libraries.in-this-file"
msgstr "BIBLIOTEQUES EN AQUEST FITXER"
-#: src/app/main/ui/workspace/libraries.cljs:629, src/app/main/ui/workspace/libraries.cljs:649
+#: src/app/main/ui/workspace/libraries.cljs:611, src/app/main/ui/workspace/libraries.cljs:631
msgid "workspace.libraries.libraries"
msgstr "BIBLIOTEQUES"
@@ -3083,43 +3076,39 @@ msgstr "BIBLIOTEQUES"
msgid "workspace.libraries.library"
msgstr "BIBLIOTECA"
-#: src/app/main/ui/workspace/libraries.cljs:481
+#: src/app/main/ui/workspace/libraries.cljs:465
msgid "workspace.libraries.no-libraries-need-sync"
msgstr "No hi ha biblioteques compartides pendents d'actualitzar"
-#: src/app/main/ui/workspace/libraries.cljs:394
+#: src/app/main/ui/workspace/libraries.cljs:378
msgid "workspace.libraries.no-matches-for"
msgstr "No s'ha trobat cap coincidència per a “%s“"
-#: src/app/main/ui/workspace/libraries.cljs:384
-msgid "workspace.libraries.no-shared-libraries-available"
-msgstr "No hi ha biblioteques compartides disponibles"
-
-#: src/app/main/ui/workspace/libraries.cljs:337
+#: src/app/main/ui/workspace/libraries.cljs:334
msgid "workspace.libraries.search-shared-libraries"
msgstr "Cerca biblioteques compartides"
-#: src/app/main/ui/workspace/libraries.cljs:333
+#: src/app/main/ui/workspace/libraries.cljs:330
msgid "workspace.libraries.shared-libraries"
msgstr "BIBLIOTEQUES COMPARTIDES"
-#: src/app/main/ui/workspace/sidebar/options/menus/text.cljs:311
+#: src/app/main/ui/workspace/sidebar/options/menus/text.cljs:309
msgid "workspace.libraries.text.multiple-typography"
msgstr "Diverses tipografies"
-#: src/app/main/ui/workspace/sidebar/options/menus/text.cljs:314
+#: src/app/main/ui/workspace/sidebar/options/menus/text.cljs:312
msgid "workspace.libraries.text.multiple-typography-tooltip"
msgstr "Desvincula totes les tipografies"
-#: src/app/main/ui/workspace/libraries.cljs:110, src/app/main/ui/workspace/libraries.cljs:137
+#: src/app/main/ui/workspace/libraries.cljs:109, src/app/main/ui/workspace/libraries.cljs:136
msgid "workspace.libraries.typography"
msgstr "%s tipografies"
-#: src/app/main/ui/workspace/libraries.cljs:503
+#: src/app/main/ui/workspace/libraries.cljs:487
msgid "workspace.libraries.update"
msgstr "Actualitza"
-#: src/app/main/ui/workspace/libraries.cljs:632
+#: src/app/main/ui/workspace/libraries.cljs:614
msgid "workspace.libraries.updates"
msgstr "ACTUALITZACIONS"
@@ -3139,15 +3128,15 @@ msgstr "Difuminat del grup"
msgid "workspace.options.blur-options.title.multiple"
msgstr "Difuminat de selecció"
-#: src/app/main/ui/workspace/sidebar/options/page.cljs:38, src/app/main/ui/workspace/sidebar/options/page.cljs:45
+#: src/app/main/ui/workspace/sidebar/options/page.cljs:42, src/app/main/ui/workspace/sidebar/options/page.cljs:50
msgid "workspace.options.canvas-background"
msgstr "Fons del llenç"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:431
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:428
msgid "workspace.options.clip-content"
msgstr "Trunca el contingut"
-#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:590, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:595
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:678, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:683, src/app/main/ui/workspace/sidebar/options/menus/component.cljs:812
msgid "workspace.options.component"
msgstr "Component"
@@ -3195,7 +3184,7 @@ msgstr "Superior i inferior"
msgid "workspace.options.design"
msgstr "Disseny"
-#: src/app/main/ui/viewer/inspect/exports.cljs:139
+#: src/app/main/ui/inspect/exports.cljs:140
msgid "workspace.options.export"
msgstr "Exporta"
@@ -3204,11 +3193,11 @@ msgstr "Exporta"
msgid "workspace.options.export-multiple"
msgstr "Exporta la selecció"
-#: src/app/main/ui/viewer/inspect/exports.cljs:195, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:248
+#: src/app/main/ui/inspect/exports.cljs:196, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:249
msgid "workspace.options.export-object"
msgstr "Exporta 1 element"
-#: src/app/main/ui/viewer/inspect/exports.cljs:178, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:228
+#: src/app/main/ui/inspect/exports.cljs:179, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:229
msgid "workspace.options.export.suffix"
msgstr "Sufix"
@@ -3216,7 +3205,7 @@ msgstr "Sufix"
msgid "workspace.options.exporting-complete"
msgstr "Exportació completa"
-#: src/app/main/ui/exports/assets.cljs:169, src/app/main/ui/exports/assets.cljs:240, src/app/main/ui/viewer/inspect/exports.cljs:194, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:247
+#: src/app/main/ui/exports/assets.cljs:169, src/app/main/ui/exports/assets.cljs:240, src/app/main/ui/inspect/exports.cljs:195, src/app/main/ui/workspace/sidebar/options/menus/exports.cljs:248
msgid "workspace.options.exporting-object"
msgstr "S'està exportant…"
@@ -3346,7 +3335,7 @@ msgstr "Emplenament del grup"
msgid "workspace.options.group-stroke"
msgstr "Traç del grup"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:362
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:359
msgid "workspace.options.height"
msgstr "Altura"
@@ -3728,11 +3717,11 @@ msgstr "espaiat"
msgid "workspace.options.layout.top"
msgstr "Dalt"
-#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:171
+#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:157
msgid "workspace.options.more-colors"
msgstr "Més colors"
-#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:155
+#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:141
msgid "workspace.options.more-lib-colors"
msgstr "Més llibreries de colors"
@@ -3769,7 +3758,7 @@ msgstr "Superior esquerra"
msgid "workspace.options.radius-top-right"
msgstr "Superior dreta"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:186
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:189
msgid "workspace.options.recent-fonts"
msgstr "Recent"
@@ -3777,11 +3766,11 @@ msgstr "Recent"
msgid "workspace.options.retry"
msgstr "Torna-ho a provar"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:406
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:403
msgid "workspace.options.rotation"
msgstr "Rotació"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:183
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:186
msgid "workspace.options.search-font"
msgstr "Cerca tipografia"
@@ -3791,7 +3780,7 @@ msgstr ""
"Seleccioneu una forma, un tauler o un grup per a arrossegar una connexió a "
"un altre tauler."
-#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:128
+#: src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs:114
msgid "workspace.options.selection-color"
msgstr "Colors seleccionats"
@@ -3803,43 +3792,43 @@ msgstr "Emplenament de selecció"
msgid "workspace.options.selection-stroke"
msgstr "Traç de la selecció"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:40, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:202, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:204
+#: src/app/main/ui/inspect/attributes/shadow.cljs:40, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:168, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:170
msgid "workspace.options.shadow-options.blur"
msgstr "Difuminat"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:242
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:200
msgid "workspace.options.shadow-options.color"
msgstr "Color de l'ombra"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:146
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:112
msgid "workspace.options.shadow-options.drop-shadow"
msgstr "Ombra caiguda"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:147
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:113
msgid "workspace.options.shadow-options.inner-shadow"
msgstr "Ombra interior"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:38, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:190
+#: src/app/main/ui/inspect/attributes/shadow.cljs:38, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:158
msgid "workspace.options.shadow-options.offsetx"
msgstr "X"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:39, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:228
+#: src/app/main/ui/inspect/attributes/shadow.cljs:39, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:190
msgid "workspace.options.shadow-options.offsety"
msgstr "Y"
-#: src/app/main/ui/viewer/inspect/attributes/shadow.cljs:41, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:215, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:217
+#: src/app/main/ui/inspect/attributes/shadow.cljs:41, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:179, src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:181
msgid "workspace.options.shadow-options.spread"
msgstr "Difusió"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:300
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:287
msgid "workspace.options.shadow-options.title"
msgstr "Ombra"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:299
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:286
msgid "workspace.options.shadow-options.title.group"
msgstr "Ombra del grup"
-#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:298
+#: src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs:285
msgid "workspace.options.shadow-options.title.multiple"
msgstr "Ombres de selecció"
@@ -3847,7 +3836,7 @@ msgstr "Ombres de selecció"
msgid "workspace.options.show-fill-on-export"
msgstr "Mostra en l'exportació"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:445
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:442
msgid "workspace.options.show-in-viewer"
msgstr "Mostra al visor"
@@ -3855,7 +3844,7 @@ msgstr "Mostra al visor"
msgid "workspace.options.size"
msgstr "Mida"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:305
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:302
msgid "workspace.options.size-presets"
msgstr "Mides predefinides"
@@ -3904,7 +3893,7 @@ msgstr "Fletxa triangular"
msgid "workspace.options.stroke-color"
msgstr "Color del traç"
-#: src/app/main/ui/workspace/sidebar/options/rows/stroke_row.cljs:165
+#: src/app/main/ui/workspace/sidebar/options/rows/stroke_row.cljs:166
msgid "workspace.options.stroke-width"
msgstr "Ample del traç"
@@ -3968,11 +3957,11 @@ msgstr "Ample automàtic"
msgid "workspace.options.text-options.grow-fixed"
msgstr "Fix"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:389
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:392
msgid "workspace.options.text-options.letter-spacing"
msgstr "Espaiat de la lletra"
-#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:371
+#: src/app/main/ui/workspace/sidebar/options/menus/typography.cljs:374
msgid "workspace.options.text-options.line-height"
msgstr "Alçada de la línia"
@@ -4038,15 +4027,15 @@ msgstr ""
"Utilitzeu el botó de «play» de la capçalera per a executar la vista de "
"prototip."
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:351
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:348
msgid "workspace.options.width"
msgstr "Ample"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:383
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:380
msgid "workspace.options.x"
msgstr "X"
-#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:394
+#: src/app/main/ui/workspace/sidebar/options/menus/measures.cljs:391
msgid "workspace.options.y"
msgstr "Y"
@@ -4098,87 +4087,87 @@ msgstr "Obre"
msgid "workspace.plugins.install"
msgstr "Instal·la"
-#: src/app/main/ui/workspace/context_menu.cljs:265
+#: src/app/main/ui/workspace/context_menu.cljs:266
msgid "workspace.shape.menu.back"
msgstr "Envia-ho al fons"
-#: src/app/main/ui/workspace/context_menu.cljs:262
+#: src/app/main/ui/workspace/context_menu.cljs:263
msgid "workspace.shape.menu.backward"
msgstr "Envia-ho darrere"
-#: src/app/main/ui/workspace/context_menu.cljs:185
+#: src/app/main/ui/workspace/context_menu.cljs:186
msgid "workspace.shape.menu.copy"
msgstr "Copia"
-#: src/app/main/ui/workspace/context_menu.cljs:364
+#: src/app/main/ui/workspace/context_menu.cljs:366
msgid "workspace.shape.menu.create-artboard-from-selection"
msgstr "Selecciona al tauler"
-#: src/app/main/ui/workspace/context_menu.cljs:561
+#: src/app/main/ui/workspace/context_menu.cljs:568
msgid "workspace.shape.menu.create-component"
msgstr "Crea un component"
-#: src/app/main/ui/workspace/context_menu.cljs:565
+#: src/app/main/ui/workspace/context_menu.cljs:572
msgid "workspace.shape.menu.create-multiple-components"
msgstr "Crea components múltiples"
-#: src/app/main/ui/workspace/context_menu.cljs:191
+#: src/app/main/ui/workspace/context_menu.cljs:192
msgid "workspace.shape.menu.cut"
msgstr "Retalla"
-#: src/app/main/ui/workspace/context_menu.cljs:585, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:764, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1052
+#: src/app/main/ui/workspace/context_menu.cljs:598, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:773, src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs:1061
msgid "workspace.shape.menu.delete"
msgstr "Elimina"
-#: src/app/main/ui/workspace/context_menu.cljs:487
+#: src/app/main/ui/workspace/context_menu.cljs:489
msgid "workspace.shape.menu.delete-flow-start"
msgstr "Elimina l'inici del flux"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:443
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:459
msgid "workspace.shape.menu.detach-instance"
msgstr "Desconnecta la instància"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:442
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:458
msgid "workspace.shape.menu.detach-instances-in-bulk"
msgstr "Desenganxa les instàncies"
-#: src/app/main/ui/workspace/context_menu.cljs:428, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:75
+#: src/app/main/ui/workspace/context_menu.cljs:430, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:75
msgid "workspace.shape.menu.difference"
msgstr "Diferència"
-#: src/app/main/ui/workspace/context_menu.cljs:197
+#: src/app/main/ui/workspace/context_menu.cljs:198
msgid "workspace.shape.menu.duplicate"
msgstr "Duplica"
-#: src/app/main/ui/workspace/context_menu.cljs:414
+#: src/app/main/ui/workspace/context_menu.cljs:416
msgid "workspace.shape.menu.edit"
msgstr "Edita"
-#: src/app/main/ui/workspace/context_menu.cljs:434
+#: src/app/main/ui/workspace/context_menu.cljs:436, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:85
msgid "workspace.shape.menu.exclude"
msgstr "Exclou"
-#: src/app/main/ui/workspace/context_menu.cljs:441, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:89
+#: src/app/main/ui/workspace/context_menu.cljs:443, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:89
msgid "workspace.shape.menu.flatten"
msgstr "Aplana"
-#: src/app/main/ui/workspace/context_menu.cljs:282
+#: src/app/main/ui/workspace/context_menu.cljs:283
msgid "workspace.shape.menu.flip-horizontal"
msgstr "Volteja horitzontalment"
-#: src/app/main/ui/workspace/context_menu.cljs:278
+#: src/app/main/ui/workspace/context_menu.cljs:279
msgid "workspace.shape.menu.flip-vertical"
msgstr "Volteja verticalment"
-#: src/app/main/ui/workspace/context_menu.cljs:489
+#: src/app/main/ui/workspace/context_menu.cljs:491
msgid "workspace.shape.menu.flow-start"
msgstr "Inici del flux"
-#: src/app/main/ui/workspace/context_menu.cljs:256
+#: src/app/main/ui/workspace/context_menu.cljs:257
msgid "workspace.shape.menu.forward"
msgstr "Porta-ho endavant"
-#: src/app/main/ui/workspace/context_menu.cljs:259
+#: src/app/main/ui/workspace/context_menu.cljs:260
msgid "workspace.shape.menu.front"
msgstr "Porta-ho a primer pla"
@@ -4187,79 +4176,79 @@ msgstr "Porta-ho a primer pla"
msgid "workspace.shape.menu.go-main"
msgstr "Vés al fitxer del component principal"
-#: src/app/main/ui/workspace/context_menu.cljs:350
+#: src/app/main/ui/workspace/context_menu.cljs:352
msgid "workspace.shape.menu.group"
msgstr "Agrupa"
-#: src/app/main/ui/workspace/context_menu.cljs:458, src/app/main/ui/workspace/sidebar/layer_item.cljs:145
+#: src/app/main/ui/workspace/context_menu.cljs:460, src/app/main/ui/workspace/sidebar/layer_item.cljs:151
msgid "workspace.shape.menu.hide"
msgstr "Amaga"
-#: src/app/main/ui/workspace/context_menu.cljs:658, src/app/main/ui/workspace/main_menu.cljs:414
+#: src/app/main/ui/workspace/context_menu.cljs:674, src/app/main/ui/workspace/main_menu.cljs:414
msgid "workspace.shape.menu.hide-ui"
msgstr "Mostra/Amaga la interfície"
-#: src/app/main/ui/workspace/context_menu.cljs:431
+#: src/app/main/ui/workspace/context_menu.cljs:433, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:80
msgid "workspace.shape.menu.intersection"
msgstr "Intersecció"
-#: src/app/main/ui/workspace/context_menu.cljs:466, src/app/main/ui/workspace/sidebar/layer_item.cljs:153, src/app/main/ui/workspace/sidebar/options/menus/layer.cljs:204
+#: src/app/main/ui/workspace/context_menu.cljs:468, src/app/main/ui/workspace/sidebar/layer_item.cljs:159, src/app/main/ui/workspace/sidebar/options/menus/layer.cljs:204
msgid "workspace.shape.menu.lock"
msgstr "Bloca"
-#: src/app/main/ui/workspace/context_menu.cljs:355
+#: src/app/main/ui/workspace/context_menu.cljs:357
msgid "workspace.shape.menu.mask"
msgstr "Màscara"
-#: src/app/main/ui/workspace/context_menu.cljs:194, src/app/main/ui/workspace/context_menu.cljs:655
+#: src/app/main/ui/workspace/context_menu.cljs:195, src/app/main/ui/workspace/context_menu.cljs:671
msgid "workspace.shape.menu.paste"
msgstr "Enganxa"
-#: src/app/main/ui/workspace/context_menu.cljs:424
+#: src/app/main/ui/workspace/context_menu.cljs:426
msgid "workspace.shape.menu.path"
msgstr "Camí"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:447
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:463
msgid "workspace.shape.menu.reset-overrides"
msgstr "Desfés les modificacions"
-#: src/app/main/ui/workspace/context_menu.cljs:246
+#: src/app/main/ui/workspace/context_menu.cljs:247
msgid "workspace.shape.menu.select-layer"
msgstr "Selecciona la capa"
-#: src/app/main/ui/workspace/context_menu.cljs:455, src/app/main/ui/workspace/sidebar/layer_item.cljs:144
+#: src/app/main/ui/workspace/context_menu.cljs:457, src/app/main/ui/workspace/sidebar/layer_item.cljs:150
msgid "workspace.shape.menu.show"
msgstr "Mostra"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:453, src/app/main/ui/workspace/sidebar/assets/components.cljs:563
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:469, src/app/main/ui/workspace/sidebar/assets/components.cljs:573
msgid "workspace.shape.menu.show-main"
msgstr "Vés al component principal"
-#: src/app/main/ui/workspace/context_menu.cljs:297
+#: src/app/main/ui/workspace/context_menu.cljs:298
msgid "workspace.shape.menu.thumbnail-remove"
msgstr "Elimina la miniatura"
-#: src/app/main/ui/workspace/context_menu.cljs:299
+#: src/app/main/ui/workspace/context_menu.cljs:300
msgid "workspace.shape.menu.thumbnail-set"
msgstr "Estableix com a miniatura"
-#: src/app/main/ui/workspace/context_menu.cljs:419
+#: src/app/main/ui/workspace/context_menu.cljs:421
msgid "workspace.shape.menu.transform-to-path"
msgstr "Transforma en camí"
-#: src/app/main/ui/workspace/context_menu.cljs:346
+#: src/app/main/ui/workspace/context_menu.cljs:348
msgid "workspace.shape.menu.ungroup"
msgstr "Desagrupa"
-#: src/app/main/ui/workspace/context_menu.cljs:425, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:70
+#: src/app/main/ui/workspace/context_menu.cljs:427, src/app/main/ui/workspace/sidebar/options/menus/bool.cljs:70
msgid "workspace.shape.menu.union"
msgstr "Unió"
-#: src/app/main/ui/workspace/context_menu.cljs:463, src/app/main/ui/workspace/sidebar/layer_item.cljs:152, src/app/main/ui/workspace/sidebar/options/menus/layer.cljs:210
+#: src/app/main/ui/workspace/context_menu.cljs:465, src/app/main/ui/workspace/sidebar/layer_item.cljs:158, src/app/main/ui/workspace/sidebar/options/menus/layer.cljs:210
msgid "workspace.shape.menu.unlock"
msgstr "Desbloca"
-#: src/app/main/ui/workspace/context_menu.cljs:360
+#: src/app/main/ui/workspace/context_menu.cljs:362
msgid "workspace.shape.menu.unmask"
msgstr "Desemmascara"
@@ -4268,15 +4257,15 @@ msgstr "Desemmascara"
msgid "workspace.shape.menu.update-components-in-bulk"
msgstr "Actualitza els components principals"
-#: src/app/main/ui/workspace/sidebar/assets/common.cljs:456
+#: src/app/main/ui/workspace/sidebar/assets/common.cljs:472
msgid "workspace.shape.menu.update-main"
msgstr "Actualitza el component principal"
-#: src/app/main/ui/workspace/right_header.cljs:246, src/app/main/ui/workspace/right_header.cljs:247
+#: src/app/main/ui/workspace/right_header.cljs:212, src/app/main/ui/workspace/right_header.cljs:213
msgid "workspace.sidebar.history"
msgstr "Historial"
-#: src/app/main/ui/workspace/sidebar/layers.cljs:525, src/app/main/ui/workspace/sidebar.cljs:127, src/app/main/ui/workspace/sidebar.cljs:131, src/app/main/ui/workspace/sidebar.cljs:140
+#: src/app/main/ui/workspace/sidebar/layers.cljs:525, src/app/main/ui/workspace/sidebar.cljs:128, src/app/main/ui/workspace/sidebar.cljs:132, src/app/main/ui/workspace/sidebar.cljs:141
msgid "workspace.sidebar.layers"
msgstr "Capes"
@@ -4312,7 +4301,7 @@ msgstr "Formes"
msgid "workspace.sidebar.layers.texts"
msgstr "Textos"
-#: src/app/main/ui/viewer/inspect/attributes/svg.cljs:56, src/app/main/ui/workspace/sidebar/options/menus/svg_attrs.cljs:101
+#: src/app/main/ui/inspect/attributes/svg.cljs:56, src/app/main/ui/workspace/sidebar/options/menus/svg_attrs.cljs:101
msgid "workspace.sidebar.options.svg-attrs.title"
msgstr "Atributs SVG importats"
@@ -4320,11 +4309,11 @@ msgstr "Atributs SVG importats"
msgid "workspace.sidebar.sitemap"
msgstr "Pàgines"
-#: src/app/main/ui/workspace/left_header.cljs:92
+#: src/app/main/ui/workspace/left_header.cljs:97
msgid "workspace.sitemap"
msgstr "Mapa del lloc"
-#: src/app/main/ui/workspace/sidebar.cljs:134, src/app/main/ui/workspace/sidebar.cljs:143
+#: src/app/main/ui/workspace/sidebar.cljs:135, src/app/main/ui/workspace/sidebar.cljs:144
msgid "workspace.toolbar.assets"
msgstr "Recursos"
@@ -4332,35 +4321,35 @@ msgstr "Recursos"
msgid "workspace.toolbar.color-palette"
msgstr "Paleta de colors (%s)"
-#: src/app/main/ui/workspace/right_header.cljs:235, src/app/main/ui/workspace/right_header.cljs:236
+#: src/app/main/ui/workspace/right_header.cljs:201, src/app/main/ui/workspace/right_header.cljs:202
msgid "workspace.toolbar.comments"
msgstr "Comentaris (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:181, src/app/main/ui/workspace/top_toolbar.cljs:182
+#: src/app/main/ui/workspace/top_toolbar.cljs:190, src/app/main/ui/workspace/top_toolbar.cljs:191
msgid "workspace.toolbar.curve"
msgstr "Corba (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:161, src/app/main/ui/workspace/top_toolbar.cljs:162
+#: src/app/main/ui/workspace/top_toolbar.cljs:170, src/app/main/ui/workspace/top_toolbar.cljs:171
msgid "workspace.toolbar.ellipse"
msgstr "El·lipse (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:143, src/app/main/ui/workspace/top_toolbar.cljs:144
+#: src/app/main/ui/workspace/top_toolbar.cljs:132, src/app/main/ui/workspace/top_toolbar.cljs:153
msgid "workspace.toolbar.frame"
msgstr "Tauler (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:60, src/app/main/ui/workspace/top_toolbar.cljs:61
+#: src/app/main/ui/workspace/top_toolbar.cljs:61, src/app/main/ui/workspace/top_toolbar.cljs:62
msgid "workspace.toolbar.image"
msgstr "Imatge (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:133, src/app/main/ui/workspace/top_toolbar.cljs:134
+#: src/app/main/ui/workspace/top_toolbar.cljs:142, src/app/main/ui/workspace/top_toolbar.cljs:143
msgid "workspace.toolbar.move"
msgstr "Mou (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:190, src/app/main/ui/workspace/top_toolbar.cljs:191
+#: src/app/main/ui/workspace/top_toolbar.cljs:199, src/app/main/ui/workspace/top_toolbar.cljs:200
msgid "workspace.toolbar.path"
msgstr "Camí (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:152, src/app/main/ui/workspace/top_toolbar.cljs:153
+#: src/app/main/ui/workspace/top_toolbar.cljs:161, src/app/main/ui/workspace/top_toolbar.cljs:162
msgid "workspace.toolbar.rect"
msgstr "Rectangle (%s)"
@@ -4369,7 +4358,7 @@ msgstr "Rectangle (%s)"
msgid "workspace.toolbar.shortcuts"
msgstr "Dreceres (%s)"
-#: src/app/main/ui/workspace/top_toolbar.cljs:170, src/app/main/ui/workspace/top_toolbar.cljs:171
+#: src/app/main/ui/workspace/top_toolbar.cljs:179, src/app/main/ui/workspace/top_toolbar.cljs:180
msgid "workspace.toolbar.text"
msgstr "Text (%s)"
@@ -4531,15 +4520,15 @@ msgstr "Operació sobre %s"
msgid "workspace.undo.title"
msgstr "Historial"
-#: src/app/main/data/workspace/libraries.cljs:1223, src/app/main/ui/workspace/sidebar/versions.cljs:261
+#: src/app/main/data/workspace/libraries.cljs:1224, src/app/main/ui/workspace/sidebar/versions.cljs:261
msgid "workspace.updates.dismiss"
msgstr "Descarta"
-#: src/app/main/data/workspace/libraries.cljs:1219
+#: src/app/main/data/workspace/libraries.cljs:1220
msgid "workspace.updates.there-are-updates"
msgstr "Hi ha actualitzacions a les biblioteques compartides"
-#: src/app/main/data/workspace/libraries.cljs:1225
+#: src/app/main/data/workspace/libraries.cljs:1226
msgid "workspace.updates.update"
msgstr "Actualitza"
diff --git a/frontend/translations/cs.po b/frontend/translations/cs.po
index ebf3b792aa..a74450b597 100644
--- a/frontend/translations/cs.po
+++ b/frontend/translations/cs.po
@@ -1,15 +1,15 @@
msgid ""
msgstr ""
-"PO-Revision-Date: 2025-01-29 22:23+0000\n"
+"PO-Revision-Date: 2025-03-20 13:42+0000\n"
"Last-Translator: Anonymous \n"
-"Language-Team: Czech \n"
+"Language-Team: Czech "
+"\n"
+"PO-Revision-Date: 2025-03-20 13:42+0000\n"
+"Last-Translator: Anonymous \n"
"Language-Team: German "
"\n"
-"Language-Team: English \n"
-"Language-Team: Spanish \n"
+"PO-Revision-Date: 2025-03-16 23:01+0000\n"
+"Last-Translator: Tummas Jóhan Sigvardsen \n"
"Language-Team: Faroese "
"\n"
+"PO-Revision-Date: 2025-03-16 23:01+0000\n"
+"Last-Translator: Louis Chance \n"
"Language-Team: French "
"\n"
+"PO-Revision-Date: 2025-03-20 13:42+0000\n"
+"Last-Translator: Anonymous \n"
"Language-Team: Hausa "
"\n"
-"Language-Team: Hebrew \n"
"Language-Team: Croatian "
"\n"
-"Language-Team: Indonesian \n"
-"Language-Team: Italian \n"
-"Language-Team: Latvian \n"
-"Language-Team: Dutch \n"
+"Language-Team: Dutch "
+"\n"
+"PO-Revision-Date: 2025-02-07 14:01+0000\n"
+"Last-Translator: Robson Cardoso dos Santos \n"
"Language-Team: Portuguese (Brazil) "
"\n"
"Language-Team: Portuguese (Portugal) "
"\n"
+"PO-Revision-Date: 2025-03-20 13:42+0000\n"
+"Last-Translator: Anonymous \n"
"Language-Team: Russian "
"\n"
-"Language-Team: Swedish \n"
"Language-Team: Thai "
"\n"
-"Language-Team: Ukrainian \n"
"Language-Team: Yoruba "
"\n"
+"PO-Revision-Date: 2025-03-20 13:42+0000\n"
+"Last-Translator: Anonymous \n"
"Language-Team: Chinese (Simplified Han script) "
"\n"
-"Language-Team: Chinese (Traditional) "
+"Language-Team: Chinese (Traditional Han script) "
"> = None;
-extern "C" {
- fn emscripten_GetProcAddress(
- name: *const ::std::os::raw::c_char,
- ) -> *const ::std::os::raw::c_void;
-}
-
#[macro_export]
macro_rules! with_state {
- ($state:ident, $block:block) => {
+ ($state:ident, $block:block) => {{
let $state = unsafe {
#[allow(static_mut_refs)]
STATE.as_mut()
}
.expect("Got an invalid state pointer");
$block
- };
+ }};
}
#[macro_export]
@@ -50,15 +50,6 @@ macro_rules! with_current_shape {
};
}
-fn init_gl() {
- unsafe {
- gl::load_with(|addr| {
- let addr = std::ffi::CString::new(addr).unwrap();
- emscripten_GetProcAddress(addr.into_raw() as *const _) as *const _
- });
- }
-}
-
/// This is called from JS after the WebGL context has been created.
#[no_mangle]
pub extern "C" fn init(width: i32, height: i32) {
@@ -75,10 +66,9 @@ pub extern "C" fn clean_up() {
}
#[no_mangle]
-pub extern "C" fn clear_cache() {
+pub extern "C" fn clear_drawing_cache() {
with_state!(state, {
- let render_state = state.render_state();
- render_state.clear_cache();
+ state.rebuild_tiles();
});
}
@@ -106,20 +96,26 @@ pub extern "C" fn render(timestamp: i32) {
});
}
-#[no_mangle]
-pub extern "C" fn render_from_cache() {
- with_state!(state, {
- state.render_from_cache();
- });
-}
-
#[no_mangle]
pub extern "C" fn process_animation_frame(timestamp: i32) {
- with_state!(state, {
- state
- .process_animation_frame(timestamp)
- .expect("Error processing animation frame");
+ let result = std::panic::catch_unwind(|| {
+ with_state!(state, {
+ state
+ .process_animation_frame(timestamp)
+ .expect("Error processing animation frame");
+ });
});
+
+ match result {
+ Ok(_) => {}
+ Err(err) => {
+ match err.downcast_ref::() {
+ Some(message) => println!("process_animation_frame error: {}", message),
+ None => println!("process_animation_frame error: {:?}", err),
+ }
+ std::panic::resume_unwind(err);
+ }
+ }
}
#[no_mangle]
@@ -140,22 +136,17 @@ pub extern "C" fn resize_viewbox(width: i32, height: i32) {
pub extern "C" fn set_view(zoom: f32, x: f32, y: f32) {
with_state!(state, {
let render_state = state.render_state();
- render_state.invalidate_cache_if_needed();
+ let zoom_changed = zoom != render_state.viewbox.zoom;
render_state.viewbox.set_all(zoom, x, y);
- });
-}
-
-#[no_mangle]
-pub extern "C" fn set_view_zoom(zoom: f32) {
- with_state!(state, {
- state.render_state().viewbox.set_zoom(zoom);
- });
-}
-
-#[no_mangle]
-pub extern "C" fn set_view_xy(x: f32, y: f32) {
- with_state!(state, {
- state.render_state().viewbox.set_pan_xy(x, y);
+ if zoom_changed {
+ with_state!(state, {
+ if state.render_state.options.is_profile_rebuild_tiles() {
+ state.rebuild_tiles();
+ } else {
+ state.rebuild_tiles_shallow();
+ }
+ });
+ }
});
}
@@ -168,12 +159,11 @@ pub extern "C" fn use_shape(a: u32, b: u32, c: u32, d: u32) {
}
#[no_mangle]
-pub unsafe extern "C" fn set_parent(a: u32, b: u32, c: u32, d: u32) {
- let state = unsafe { STATE.as_mut() }.expect("Got an invalid state pointer");
- let id = uuid_from_u32_quartet(a, b, c, d);
- if let Some(shape) = state.current_shape() {
+pub extern "C" fn set_parent(a: u32, b: u32, c: u32, d: u32) {
+ with_current_shape!(state, |shape: &mut Shape| {
+ let id = uuid_from_u32_quartet(a, b, c, d);
shape.set_parent(id);
- }
+ });
}
#[no_mangle]
@@ -191,7 +181,7 @@ pub extern "C" fn set_shape_bool_type(raw_bool_type: u8) {
}
#[no_mangle]
-pub unsafe extern "C" fn set_shape_type(shape_type: u8) {
+pub extern "C" fn set_shape_type(shape_type: u8) {
with_current_shape!(state, |shape: &mut Shape| {
shape.set_shape_type(Type::from(shape_type));
});
@@ -199,8 +189,8 @@ pub unsafe extern "C" fn set_shape_type(shape_type: u8) {
#[no_mangle]
pub extern "C" fn set_shape_selrect(left: f32, top: f32, right: f32, bottom: f32) {
- with_current_shape!(state, |shape: &mut Shape| {
- shape.set_selrect(left, top, right, bottom);
+ with_state!(state, {
+ state.set_selrect_for_current_shape(left, top, right, bottom);
});
}
@@ -234,72 +224,30 @@ pub extern "C" fn add_shape_child(a: u32, b: u32, c: u32, d: u32) {
}
#[no_mangle]
-pub extern "C" fn clear_shape_children() {
- with_current_shape!(state, |shape: &mut Shape| {
- shape.clear_children();
- });
-}
+pub extern "C" fn set_children() {
+ let bytes = mem::bytes_or_empty();
-#[no_mangle]
-pub extern "C" fn add_shape_solid_fill(raw_color: u32) {
- with_current_shape!(state, |shape: &mut Shape| {
- let color = skia::Color::new(raw_color);
- shape.add_fill(shapes::Fill::Solid(color));
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_linear_fill(
- start_x: f32,
- start_y: f32,
- end_x: f32,
- end_y: f32,
- opacity: f32,
-) {
- with_current_shape!(state, |shape: &mut Shape| {
- shape.add_fill(shapes::Fill::new_linear_gradient(
- (start_x, start_y),
- (end_x, end_y),
- opacity,
- ));
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_radial_fill(
- start_x: f32,
- start_y: f32,
- end_x: f32,
- end_y: f32,
- opacity: f32,
- width: f32,
-) {
- with_current_shape!(state, |shape: &mut Shape| {
- shape.add_fill(shapes::Fill::new_radial_gradient(
- (start_x, start_y),
- (end_x, end_y),
- opacity,
- width,
- ));
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_fill_stops() {
- let bytes = mem::bytes();
-
- let entries: Vec<_> = bytes
- .chunks(size_of::())
- .map(|data| shapes::RawStopData::from_bytes(data.try_into().unwrap()))
+ let entries: IndexSet = bytes
+ .chunks(size_of::<::BytesType>())
+ .map(|data| Uuid::from_bytes(data.try_into().unwrap()))
.collect();
+ let mut deleted = IndexSet::new();
+
with_current_shape!(state, |shape: &mut Shape| {
- shape
- .add_fill_gradient_stops(entries)
- .expect("could not add gradient stops");
+ (_, deleted) = shape.compute_children_differences(&entries);
+ shape.children = entries.clone();
});
- mem::free_bytes();
+ with_state!(state, {
+ for id in deleted {
+ state.delete_shape(id);
+ }
+ });
+
+ if !bytes.is_empty() {
+ mem::free_bytes();
+ }
}
#[no_mangle]
@@ -308,11 +256,8 @@ pub extern "C" fn store_image(a: u32, b: u32, c: u32, d: u32) {
let id = uuid_from_u32_quartet(a, b, c, d);
let image_bytes = mem::bytes();
- match state.render_state().add_image(id, &image_bytes) {
- Err(msg) => {
- eprintln!("{}", msg);
- }
- _ => {}
+ if let Err(msg) = state.render_state().add_image(id, &image_bytes) {
+ eprintln!("{}", msg);
}
mem::free_bytes();
@@ -323,35 +268,8 @@ pub extern "C" fn store_image(a: u32, b: u32, c: u32, d: u32) {
pub extern "C" fn is_image_cached(a: u32, b: u32, c: u32, d: u32) -> bool {
with_state!(state, {
let id = uuid_from_u32_quartet(a, b, c, d);
- return state.render_state().has_image(&id);
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_image_fill(
- a: u32,
- b: u32,
- c: u32,
- d: u32,
- alpha: f32,
- width: i32,
- height: i32,
-) {
- with_current_shape!(state, |shape: &mut Shape| {
- let id = uuid_from_u32_quartet(a, b, c, d);
- shape.add_fill(shapes::Fill::new_image_fill(
- id,
- (alpha * 0xff as f32).floor() as u8,
- (width, height),
- ));
- });
-}
-
-#[no_mangle]
-pub extern "C" fn clear_shape_fills() {
- with_current_shape!(state, |shape: &mut Shape| {
- shape.clear_fills();
- });
+ state.render_state().has_image(&id)
+ })
}
#[no_mangle]
@@ -424,101 +342,6 @@ pub extern "C" fn set_shape_path_content() {
});
}
-#[no_mangle]
-pub extern "C" fn add_shape_center_stroke(width: f32, style: u8, cap_start: u8, cap_end: u8) {
- with_current_shape!(state, |shape: &mut Shape| {
- shape.add_stroke(shapes::Stroke::new_center_stroke(
- width, style, cap_start, cap_end,
- ));
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_inner_stroke(width: f32, style: u8, cap_start: u8, cap_end: u8) {
- with_current_shape!(state, |shape: &mut Shape| {
- shape.add_stroke(shapes::Stroke::new_inner_stroke(
- width, style, cap_start, cap_end,
- ));
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_outer_stroke(width: f32, style: u8, cap_start: u8, cap_end: u8) {
- with_current_shape!(state, |shape: &mut Shape| {
- shape.add_stroke(shapes::Stroke::new_outer_stroke(
- width, style, cap_start, cap_end,
- ));
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_stroke_solid_fill(raw_color: u32) {
- with_current_shape!(state, |shape: &mut Shape| {
- let color = skia::Color::new(raw_color);
- shape
- .set_stroke_fill(shapes::Fill::Solid(color))
- .expect("could not add stroke solid fill");
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_stroke_linear_fill(
- start_x: f32,
- start_y: f32,
- end_x: f32,
- end_y: f32,
- opacity: f32,
-) {
- with_current_shape!(state, |shape: &mut Shape| {
- shape
- .set_stroke_fill(shapes::Fill::new_linear_gradient(
- (start_x, start_y),
- (end_x, end_y),
- opacity,
- ))
- .expect("could not add stroke linear fill");
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_stroke_radial_fill(
- start_x: f32,
- start_y: f32,
- end_x: f32,
- end_y: f32,
- opacity: f32,
- width: f32,
-) {
- with_current_shape!(state, |shape: &mut Shape| {
- shape
- .set_stroke_fill(shapes::Fill::new_radial_gradient(
- (start_x, start_y),
- (end_x, end_y),
- opacity,
- width,
- ))
- .expect("could not add stroke radial fill");
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_shape_stroke_stops() {
- let bytes = mem::bytes();
-
- let entries: Vec<_> = bytes
- .chunks(size_of::())
- .map(|data| shapes::RawStopData::from_bytes(data.try_into().unwrap()))
- .collect();
-
- with_current_shape!(state, |shape: &mut Shape| {
- shape
- .add_stroke_gradient_stops(entries)
- .expect("could not add gradient stops");
- });
-
- mem::free_bytes();
-}
-
// Extracts a string from the bytes slice until the next null byte (0) and returns the result as a `String`.
// Updates the `start` index to the end of the extracted string.
fn extract_string(start: &mut usize, bytes: &[u8]) -> String {
@@ -537,35 +360,6 @@ fn extract_string(start: &mut usize, bytes: &[u8]) -> String {
}
}
-#[no_mangle]
-pub extern "C" fn add_shape_image_stroke(
- a: u32,
- b: u32,
- c: u32,
- d: u32,
- alpha: f32,
- width: i32,
- height: i32,
-) {
- with_current_shape!(state, |shape: &mut Shape| {
- let id = uuid_from_u32_quartet(a, b, c, d);
- shape
- .set_stroke_fill(shapes::Fill::new_image_fill(
- id,
- (alpha * 0xff as f32).floor() as u8,
- (width, height),
- ))
- .expect("could not add stroke image fill");
- });
-}
-
-#[no_mangle]
-pub extern "C" fn clear_shape_strokes() {
- with_current_shape!(state, |shape: &mut Shape| {
- shape.clear_strokes();
- });
-}
-
#[no_mangle]
pub extern "C" fn set_shape_corners(r1: f32, r2: f32, r3: f32, r4: f32) {
with_current_shape!(state, |shape: &mut Shape| {
@@ -597,13 +391,37 @@ pub extern "C" fn propagate_modifiers() -> *mut u8 {
with_state!(state, {
let result = shapes::propagate_modifiers(state, entries);
- return mem::write_vec(result);
+ mem::write_vec(result)
+ })
+}
+
+#[no_mangle]
+pub extern "C" fn set_structure_modifiers() {
+ let bytes = mem::bytes();
+
+ let entries: Vec<_> = bytes
+ .chunks(40)
+ .map(|data| StructureEntry::from_bytes(data.try_into().unwrap()))
+ .collect();
+
+ with_state!(state, {
+ for entry in entries {
+ state.structure.entry(entry.parent).or_insert_with(Vec::new);
+ state
+ .structure
+ .get_mut(&entry.parent)
+ .expect("Parent not found for entry")
+ .push(entry);
+ }
});
+
+ mem::free_bytes();
}
#[no_mangle]
pub extern "C" fn clean_modifiers() {
with_state!(state, {
+ state.structure.clear();
state.modifiers.clear();
});
}
@@ -621,7 +439,7 @@ pub extern "C" fn set_modifiers() {
for entry in entries {
state.modifiers.insert(entry.id, entry.transform);
}
- state.render_state().clear_cache();
+ state.rebuild_modifier_tiles();
});
}
@@ -650,6 +468,13 @@ pub extern "C" fn clear_shape_shadows() {
});
}
+#[no_mangle]
+pub extern "C" fn update_shape_tiles() {
+ with_state!(state, {
+ state.update_tile_for_current_shape();
+ });
+}
+
#[no_mangle]
pub extern "C" fn set_flex_layout_data(
dir: u8,
@@ -665,7 +490,7 @@ pub extern "C" fn set_flex_layout_data(
padding_bottom: f32,
padding_left: f32,
) {
- let dir = shapes::Direction::from_u8(dir);
+ let dir = shapes::FlexDirection::from_u8(dir);
let align_items = shapes::AlignItems::from_u8(align_items);
let align_content = shapes::AlignContent::from_u8(align_content);
let justify_items = shapes::JustifyItems::from_u8(justify_items);
@@ -743,14 +568,91 @@ pub extern "C" fn set_layout_child_data(
}
#[no_mangle]
-pub extern "C" fn set_grid_layout_data() {}
+pub extern "C" fn set_grid_layout_data(
+ dir: u8,
+ row_gap: f32,
+ column_gap: f32,
+ align_items: u8,
+ align_content: u8,
+ justify_items: u8,
+ justify_content: u8,
+ padding_top: f32,
+ padding_right: f32,
+ padding_bottom: f32,
+ padding_left: f32,
+) {
+ let dir = shapes::GridDirection::from_u8(dir);
+ let align_items = shapes::AlignItems::from_u8(align_items);
+ let align_content = shapes::AlignContent::from_u8(align_content);
+ let justify_items = shapes::JustifyItems::from_u8(justify_items);
+ let justify_content = shapes::JustifyContent::from_u8(justify_content);
+
+ with_current_shape!(state, |shape: &mut Shape| {
+ shape.set_grid_layout_data(
+ dir,
+ row_gap,
+ column_gap,
+ align_items,
+ align_content,
+ justify_items,
+ justify_content,
+ padding_top,
+ padding_right,
+ padding_bottom,
+ padding_left,
+ );
+ });
+}
#[no_mangle]
-pub extern "C" fn add_grid_track() {}
+pub extern "C" fn set_grid_columns() {
+ let bytes = mem::bytes();
+
+ let entries: Vec<_> = bytes
+ .chunks(size_of::())
+ .map(|data| shapes::RawGridTrack::from_bytes(data.try_into().unwrap()))
+ .collect();
+
+ with_current_shape!(state, |shape: &mut Shape| {
+ shape.set_grid_columns(entries);
+ });
+
+ mem::free_bytes();
+}
#[no_mangle]
-pub extern "C" fn set_grid_cell() {}
+pub extern "C" fn set_grid_rows() {
+ let bytes = mem::bytes();
+
+ let entries: Vec<_> = bytes
+ .chunks(size_of::())
+ .map(|data| shapes::RawGridTrack::from_bytes(data.try_into().unwrap()))
+ .collect();
+
+ with_current_shape!(state, |shape: &mut Shape| {
+ shape.set_grid_rows(entries);
+ });
+
+ mem::free_bytes();
+}
+
+#[no_mangle]
+pub extern "C" fn set_grid_cells() {
+ let bytes = mem::bytes();
+
+ let entries: Vec<_> = bytes
+ .chunks(size_of::())
+ .map(|data| shapes::RawGridCell::from_bytes(data.try_into().unwrap()))
+ .collect();
+
+ with_current_shape!(state, |shape: &mut Shape| {
+ shape.set_grid_cells(entries);
+ });
+
+ mem::free_bytes();
+}
fn main() {
- init_gl();
+ #[cfg(target_arch = "wasm32")]
+ init_gl!();
}
diff --git a/render-wasm/src/math.rs b/render-wasm/src/math.rs
index ada204936a..f62e22250b 100644
--- a/render-wasm/src/math.rs
+++ b/render-wasm/src/math.rs
@@ -5,6 +5,8 @@ pub type Matrix = skia::Matrix;
pub type Vector = skia::Vector;
pub type Point = skia::Point;
+const THRESHOLD: f32 = 0.001;
+
pub trait VectorExt {
fn new_points(a: &Point, b: &Point) -> Vector;
}
@@ -16,7 +18,20 @@ impl VectorExt for Vector {
}
}
-#[derive(Debug, Clone, PartialEq)]
+pub fn is_close_to(current: f32, value: f32) -> bool {
+ (current - value).abs() <= THRESHOLD
+}
+
+pub fn identitish(m: Matrix) -> bool {
+ is_close_to(m.scale_x(), 1.0)
+ && is_close_to(m.scale_y(), 1.0)
+ && is_close_to(m.translate_x(), 0.0)
+ && is_close_to(m.translate_y(), 0.0)
+ && is_close_to(m.skew_x(), 0.0)
+ && is_close_to(m.skew_y(), 0.0)
+}
+
+#[derive(Debug, Copy, Clone, PartialEq)]
pub struct Bounds {
pub nw: Point,
pub ne: Point,
@@ -95,9 +110,9 @@ impl Bounds {
self.sw = mtx.map_point(self.sw);
}
- // pub fn box_bounds(&self, other: &Self) -> Option {
- // self.from_points(other.points())
- // }
+ pub fn box_bounds(&self, other: &Self) -> Option {
+ self.from_points(other.points())
+ }
pub fn from_points(&self, points: Vec) -> Option {
let hv = self.horizontal_vec();
@@ -280,6 +295,14 @@ impl Bounds {
let m = self.transform_matrix().unwrap_or(Matrix::default());
m.scale_y() < 0.0
}
+
+ pub fn to_rect(&self) -> Rect {
+ let minx = self.nw.x.min(self.ne.x).min(self.sw.x).min(self.se.x);
+ let miny = self.nw.y.min(self.ne.y).min(self.sw.y).min(self.se.y);
+ let maxx = self.nw.x.max(self.ne.x).max(self.sw.x).max(self.se.x);
+ let maxy = self.nw.y.max(self.ne.y).max(self.sw.y).max(self.se.y);
+ Rect::from_ltrb(minx, miny, maxx, maxy)
+ }
}
#[derive(Debug, Clone, PartialEq)]
diff --git a/render-wasm/src/mem.rs b/render-wasm/src/mem.rs
index f9a71c4a2b..0b0edfd9c4 100644
--- a/render-wasm/src/mem.rs
+++ b/render-wasm/src/mem.rs
@@ -1,5 +1,9 @@
+use std::alloc::{alloc, Layout};
+use std::ptr;
use std::sync::Mutex;
+const LAYOUT_ALIGN: usize = 4;
+
static BUFFERU8: Mutex>>> = Mutex::new(None);
#[no_mangle]
@@ -10,11 +14,17 @@ pub extern "C" fn alloc_bytes(len: usize) -> *mut u8 {
panic!("Bytes already allocated");
}
- let mut new_buffer = Box::new(vec![0u8; len]);
- let ptr = new_buffer.as_mut_ptr();
-
- *guard = Some(new_buffer);
- ptr
+ unsafe {
+ let layout = Layout::from_size_align_unchecked(len, LAYOUT_ALIGN);
+ let ptr = alloc(layout) as *mut u8;
+ if ptr.is_null() {
+ panic!("Allocation failed");
+ }
+ // TODO: Maybe this could be removed.
+ ptr::write_bytes(ptr, 0, len);
+ *guard = Some(Box::new(Vec::from_raw_parts(ptr, len, len)));
+ ptr
+ }
}
pub fn write_bytes(bytes: Vec) -> *mut u8 {
@@ -46,6 +56,12 @@ pub fn bytes() -> Vec {
.map_or_else(|| panic!("Buffer is not initialized"), |buffer| *buffer)
}
+pub fn bytes_or_empty() -> Vec {
+ let mut guard = BUFFERU8.lock().unwrap();
+
+ guard.take().map_or_else(|| Vec::new(), |buffer| *buffer)
+}
+
pub trait SerializableResult {
type BytesType;
fn from_bytes(bytes: Self::BytesType) -> Self;
diff --git a/render-wasm/src/options.rs b/render-wasm/src/options.rs
new file mode 100644
index 0000000000..37afacfc21
--- /dev/null
+++ b/render-wasm/src/options.rs
@@ -0,0 +1,2 @@
+pub const DEBUG_VISIBLE: u32 = 0x01;
+pub const PROFILE_REBUILD_TILES: u32 = 0x02;
diff --git a/render-wasm/src/performance.rs b/render-wasm/src/performance.rs
new file mode 100644
index 0000000000..b19fafa0ea
--- /dev/null
+++ b/render-wasm/src/performance.rs
@@ -0,0 +1,168 @@
+#[allow(unused_imports)]
+#[cfg(target_arch = "wasm32")]
+use crate::get_now;
+
+#[allow(dead_code)]
+#[cfg(target_arch = "wasm32")]
+pub fn get_time() -> i32 {
+ crate::get_now!() as i32
+}
+
+#[allow(dead_code)]
+#[cfg(not(target_arch = "wasm32"))]
+pub fn get_time() -> i32 {
+ let now = std::time::Instant::now();
+ now.elapsed().as_millis() as i32
+}
+
+#[macro_export]
+macro_rules! mark {
+ ($name:expr) => {
+ #[cfg(all(feature = "profile-macros", target_arch = "wasm32"))]
+ {
+ use crate::run_script;
+ run_script!(format!("performance.mark('{}')", $name));
+ }
+ };
+}
+
+#[macro_export]
+macro_rules! measure {
+ ($name:expr) => {
+ #[cfg(all(feature = "profile-macros", target_arch = "wasm32"))]
+ {
+ use crate::run_script;
+ run_script!(format!("performance.measure('{}')", $name));
+ }
+ };
+ ($name:expr, $mark_begin:expr) => {
+ #[cfg(all(feature = "profile-macros", target_arch = "wasm32"))]
+ {
+ use crate::run_script;
+ run_script!(format!(
+ "performance.measure('{}','{}')",
+ $name, $mark_begin
+ ));
+ }
+ };
+ ($name:expr, $mark_begin:expr, $mark_end:expr) => {
+ #[cfg(all(feature = "profile-macros", target_arch = "wasm32"))]
+ {
+ use crate::run_script;
+ run_script!(format!(
+ "performance.measure('{}','{}','{}')",
+ $name, $mark_begin, $mark_end
+ ));
+ }
+ };
+}
+
+#[macro_export]
+macro_rules! begin_mark_name {
+ ($name:expr) => {
+ format!("{}::begin", $name)
+ };
+}
+
+#[macro_export]
+macro_rules! end_mark_name {
+ ($name:expr) => {
+ format!("{}::end", $name)
+ };
+}
+
+#[macro_export]
+macro_rules! measure_marks {
+ ($name:expr) => {
+ #[cfg(all(feature = "profile-macros", target_arch = "wasm32"))]
+ {
+ use crate::{begin_mark_name, end_mark_name, measure};
+ measure!($name, begin_mark_name!($name), end_mark_name!($name));
+ }
+ };
+}
+
+#[macro_export]
+macro_rules! clear_marks {
+ () => {
+ use crate::run_script;
+ run_script!("performance.clearMarks()");
+ };
+ ($($name:expr),*) => {
+ format!("{}", [$(format!("performance.clearMarks('{}')", $name)),*].join("; "))
+ };
+}
+
+#[macro_export]
+macro_rules! clear_measures {
+ () => {
+ use crate::run_script;
+ run_script!("performance.clearMeasures()");
+ };
+ ($($name:expr),*) => {
+ format!("{}", [$(format!("performance.clearMeasures('{}')", $name)),*].join("; "))
+ };
+}
+
+#[macro_export]
+macro_rules! begin_measure {
+ ($name:expr) => {
+ #[cfg(all(feature = "profile-macros", target_arch = "wasm32"))]
+ {
+ use crate::{begin_mark_name, mark};
+ mark!(begin_mark_name!($name));
+ }
+ };
+ ($name:expr, $clear_marks:expr) => {
+ #[cfg(all(feature = "profile-macros", target_arch = "wasm32"))]
+ {
+ use crate::{begin_mark_name, clear_marks, end_mark_name, mark};
+ if $clear_marks {
+ clear_marks!(begin_mark_name!($name), end_mark_name($name));
+ }
+ mark!(begin_mark_name!($name));
+ }
+ };
+}
+
+#[macro_export]
+macro_rules! end_measure {
+ ($name:expr) => {
+ #[cfg(all(feature = "profile-macros", target_arch = "wasm32"))]
+ {
+ use crate::{end_mark_name, mark, measure_marks};
+ mark!(end_mark_name!($name));
+ measure_marks!($name);
+ }
+ };
+ ($name:expr, $clear_marks:expr) => {
+ #[cfg(all(feature = "profile-macros", target_arch = "wasm32"))]
+ {
+ use crate::{begin_mark_name, clear_marks, end_mark_name, mark, measure_marks};
+ mark!(end_mark_name!($name));
+ measure_marks!($name);
+ if $clear_marks {
+ clear_marks!(begin_mark_name!($name), end_mark_name($name));
+ }
+ }
+ };
+}
+
+// We need to reexport the macro to make it public.
+#[allow(unused_imports)]
+pub use clear_marks;
+
+#[allow(unused_imports)]
+pub use clear_measures;
+
+#[allow(unused_imports)]
+pub use mark;
+
+#[allow(unused_imports)]
+pub use measure;
+
+#[allow(unused_imports)]
+pub use begin_measure;
+
+#[allow(unused_imports)]
+pub use end_measure;
diff --git a/render-wasm/src/render.rs b/render-wasm/src/render.rs
index 318df808e2..e7e77db654 100644
--- a/render-wasm/src/render.rs
+++ b/render-wasm/src/render.rs
@@ -1,11 +1,13 @@
-use skia_safe::{self as skia, Contains, Matrix, RRect, Rect};
-use std::collections::HashMap;
-use uuid::Uuid;
+use skia_safe::{self as skia, Matrix, RRect, Rect};
+use crate::uuid::Uuid;
+use std::collections::{HashMap, HashSet, VecDeque};
+
+use crate::performance;
use crate::view::Viewbox;
+use crate::wapi;
mod blend;
-mod cache;
mod debug;
mod fills;
mod fonts;
@@ -16,9 +18,9 @@ mod shadows;
mod strokes;
mod surfaces;
mod text;
+mod tiles;
-use crate::shapes::{Corners, Shape, Type};
-use cache::CachedSurfaceImage;
+use crate::shapes::{modified_children_ids, Corners, Shape, StructureEntry, Type};
use gpu_state::GpuState;
use options::RenderOptions;
use surfaces::{SurfaceId, Surfaces};
@@ -27,19 +29,11 @@ pub use blend::BlendMode;
pub use fonts::*;
pub use images::*;
+// This is the extra are used for tile rendering.
+const VIEWPORT_INTEREST_AREA_THRESHOLD: i32 = 1;
const MAX_BLOCKING_TIME_MS: i32 = 32;
const NODE_BATCH_THRESHOLD: i32 = 10;
-extern "C" {
- fn emscripten_run_script(script: *const i8);
- fn emscripten_run_script_int(script: *const i8) -> i32;
-}
-
-fn get_time() -> i32 {
- let script = std::ffi::CString::new("performance.now()").unwrap();
- unsafe { emscripten_run_script_int(script.as_ptr()) }
-}
-
pub struct NodeRenderState {
pub id: Uuid,
// We use this bool to keep that we've traversed all the children inside this node.
@@ -56,7 +50,7 @@ impl NodeRenderState {
pub fn get_children_clip_bounds(
&self,
element: &Shape,
- modifiers: &HashMap,
+ modifiers: Option<&Matrix>,
) -> Option<(Rect, Option, Matrix)> {
if self.id.is_nil() || !element.clip() {
return self.clip_bounds;
@@ -67,7 +61,7 @@ impl NodeRenderState {
transform.post_translate(bounds.center());
transform.pre_translate(-bounds.center());
- if let Some(modifier) = modifiers.get(&element.id) {
+ if let Some(modifier) = modifiers {
transform.post_concat(modifier);
}
@@ -85,8 +79,7 @@ pub(crate) struct RenderState {
gpu_state: GpuState,
pub options: RenderOptions,
pub surfaces: Surfaces,
- fonts: FontStore,
- pub cached_surface_image: Option,
+ pub fonts: FontStore,
pub viewbox: Viewbox,
pub images: ImageStore,
pub background_color: skia::Color,
@@ -95,40 +88,50 @@ pub(crate) struct RenderState {
// Indicates whether the rendering process has pending frames.
pub render_in_progress: bool,
// Stack of nodes pending to be rendered.
- pub pending_nodes: Vec,
- pub render_complete: bool,
+ pub pending_nodes: VecDeque,
+ pub current_tile: Option,
pub sampling_options: skia::SamplingOptions,
+ pub render_area: Rect,
+ pub tiles: tiles::TileHashMap,
+ pub pending_tiles: Vec,
}
impl RenderState {
pub fn new(width: i32, height: i32) -> RenderState {
// This needs to be done once per WebGL context.
let mut gpu_state = GpuState::new();
-
let sampling_options =
skia::SamplingOptions::new(skia::FilterMode::Linear, skia::MipmapMode::Nearest);
- let surfaces = Surfaces::new(&mut gpu_state, (width, height), sampling_options);
let fonts = FontStore::new();
+ let surfaces = Surfaces::new(
+ &mut gpu_state,
+ (width, height),
+ sampling_options,
+ tiles::get_tile_dimensions(),
+ );
// This is used multiple times everywhere so instead of creating new instances every
// time we reuse this one.
+
+ let tiles = tiles::TileHashMap::new();
+
RenderState {
gpu_state,
- surfaces,
- cached_surface_image: None,
- // font_provider,
- // font_collection,
- fonts,
options: RenderOptions::default(),
+ surfaces,
+ fonts,
viewbox: Viewbox::new(width as f32, height as f32),
images: ImageStore::new(),
background_color: skia::Color::TRANSPARENT,
render_request_id: None,
render_in_progress: false,
- pending_nodes: vec![],
- render_complete: true,
+ pending_nodes: VecDeque::new(),
+ current_tile: None,
sampling_options,
+ render_area: Rect::new_empty(),
+ tiles,
+ pending_tiles: vec![],
}
}
@@ -141,7 +144,7 @@ impl RenderState {
}
pub fn add_image(&mut self, id: Uuid, image_data: &[u8]) -> Result<(), String> {
- self.images.add(id, image_data)
+ self.images.add(id, image_data, &mut self.gpu_state.context)
}
pub fn has_image(&mut self, id: &Uuid) -> bool {
@@ -149,7 +152,7 @@ impl RenderState {
}
pub fn set_debug_flags(&mut self, debug: u32) {
- self.options.debug_flags = debug;
+ self.options.flags = debug;
}
pub fn set_dpr(&mut self, dpr: f32) {
@@ -164,7 +167,6 @@ impl RenderState {
pub fn set_background_color(&mut self, color: skia::Color) {
self.background_color = color;
- let _ = self.render_from_cache();
}
pub fn resize(&mut self, width: i32, height: i32) {
@@ -182,45 +184,30 @@ impl RenderState {
}
pub fn reset_canvas(&mut self) {
- self.surfaces.canvas(SurfaceId::Fills).restore_to_count(1);
- self.surfaces
- .canvas(SurfaceId::DropShadows)
- .restore_to_count(1);
- self.surfaces.canvas(SurfaceId::Strokes).restore_to_count(1);
- self.surfaces.canvas(SurfaceId::Current).restore_to_count(1);
-
- self.surfaces.apply_mut(
- &[
- SurfaceId::Fills,
- SurfaceId::Strokes,
- SurfaceId::Current,
- SurfaceId::DropShadows,
- SurfaceId::Shadow,
- SurfaceId::Overlay,
- ],
- |s| {
- s.canvas().clear(self.background_color).reset_matrix();
- },
- );
-
- self.surfaces
- .canvas(SurfaceId::Debug)
- .clear(skia::Color::TRANSPARENT)
- .reset_matrix();
+ self.surfaces.reset(self.background_color);
}
- pub fn apply_render_to_final_canvas(&mut self) {
- self.surfaces.draw_into(
- SurfaceId::Current,
- SurfaceId::Target,
- Some(&skia::Paint::default()),
- );
+ pub fn apply_render_to_final_canvas(&mut self, rect: skia::Rect) {
+ let x = self.current_tile.unwrap().0;
+ let y = self.current_tile.unwrap().1;
+
+ self.surfaces.cache_current_tile_texture((x, y));
+
+ self.surfaces
+ .draw_cached_tile_surface(self.current_tile.unwrap(), rect);
+
+ if self.options.is_debug_visible() {
+ debug::render_workspace_current_tile(
+ self,
+ "".to_string(),
+ self.current_tile.unwrap(),
+ rect,
+ );
+ }
}
- pub fn apply_drawing_to_render_canvas(&mut self, shape: &Shape) {
- self.surfaces
- .flush_and_submit(&mut self.gpu_state, SurfaceId::Fills);
-
+ pub fn apply_drawing_to_render_canvas(&mut self, shape: Option<&Shape>) {
+ performance::begin_measure!("apply_drawing_to_render_canvas");
self.surfaces
.flush_and_submit(&mut self.gpu_state, SurfaceId::DropShadows);
@@ -230,18 +217,26 @@ impl RenderState {
Some(&skia::Paint::default()),
);
+ self.surfaces
+ .flush_and_submit(&mut self.gpu_state, SurfaceId::Fills);
+
self.surfaces.draw_into(
SurfaceId::Fills,
SurfaceId::Current,
Some(&skia::Paint::default()),
);
- let render_overlay_below_strokes = shape.fills().len() > 0;
+ let mut render_overlay_below_strokes = false;
+ if let Some(shape) = shape {
+ render_overlay_below_strokes = shape.has_fills();
+ }
+
if render_overlay_below_strokes {
self.surfaces
- .flush_and_submit(&mut self.gpu_state, SurfaceId::Overlay);
+ .flush_and_submit(&mut self.gpu_state, SurfaceId::InnerShadows);
+
self.surfaces.draw_into(
- SurfaceId::Overlay,
+ SurfaceId::InnerShadows,
SurfaceId::Current,
Some(&skia::Paint::default()),
);
@@ -249,6 +244,7 @@ impl RenderState {
self.surfaces
.flush_and_submit(&mut self.gpu_state, SurfaceId::Strokes);
+
self.surfaces.draw_into(
SurfaceId::Strokes,
SurfaceId::Current,
@@ -257,24 +253,22 @@ impl RenderState {
if !render_overlay_below_strokes {
self.surfaces
- .flush_and_submit(&mut self.gpu_state, SurfaceId::Overlay);
+ .flush_and_submit(&mut self.gpu_state, SurfaceId::InnerShadows);
+
self.surfaces.draw_into(
- SurfaceId::Overlay,
+ SurfaceId::InnerShadows,
SurfaceId::Current,
Some(&skia::Paint::default()),
);
}
- self.surfaces
- .draw_into(SurfaceId::Overlay, SurfaceId::Current, None);
self.surfaces
.flush_and_submit(&mut self.gpu_state, SurfaceId::Current);
self.surfaces.apply_mut(
&[
- SurfaceId::Shadow,
SurfaceId::DropShadows,
- SurfaceId::Overlay,
+ SurfaceId::InnerShadows,
SurfaceId::Fills,
SurfaceId::Strokes,
],
@@ -284,43 +278,45 @@ impl RenderState {
);
}
- pub fn invalidate_cache_if_needed(&mut self) {
- if let Some(ref mut cached_surface_image) = self.cached_surface_image {
- cached_surface_image.invalidate_if_dirty(&self.viewbox);
- }
- }
-
pub fn render_shape(
&mut self,
shape: &mut Shape,
modifiers: Option<&Matrix>,
clip_bounds: Option<(Rect, Option, Matrix)>,
) {
- let surface_ids = &[SurfaceId::Fills, SurfaceId::Strokes, SurfaceId::DropShadows];
+ let surface_ids = &[
+ SurfaceId::Fills,
+ SurfaceId::Strokes,
+ SurfaceId::DropShadows,
+ SurfaceId::InnerShadows,
+ ];
self.surfaces.apply_mut(surface_ids, |s| {
s.canvas().save();
});
+ let antialias = shape.should_use_antialias(self.get_scale());
+
// set clipping
if let Some((bounds, corners, transform)) = clip_bounds {
- self.surfaces.apply_mut(
- &[SurfaceId::Fills, SurfaceId::Strokes, SurfaceId::DropShadows],
- |s| {
- s.canvas().concat(&transform);
- },
- );
+ self.surfaces.apply_mut(surface_ids, |s| {
+ s.canvas().concat(&transform);
+ });
if let Some(corners) = corners {
let rrect = RRect::new_rect_radii(bounds, &corners);
self.surfaces.apply_mut(surface_ids, |s| {
- s.canvas().clip_rrect(rrect, skia::ClipOp::Intersect, true);
+ s.canvas()
+ .clip_rrect(rrect, skia::ClipOp::Intersect, antialias);
});
} else {
self.surfaces.apply_mut(surface_ids, |s| {
- s.canvas().clip_rect(bounds, skia::ClipOp::Intersect, true);
+ s.canvas()
+ .clip_rect(bounds, skia::ClipOp::Intersect, antialias);
});
}
+ // This renders a red line around clipped
+ // shapes (frames).
if self.options.is_debug_visible() {
let mut paint = skia::Paint::default();
paint.set_style(skia::PaintStyle::Stroke);
@@ -372,199 +368,162 @@ impl RenderState {
}
}
Type::Text(text_content) => {
- text::render(self, text_content);
+ self.surfaces.apply_mut(&[SurfaceId::Fills], |s| {
+ s.canvas().concat(&matrix);
+ });
+
+ let paragraphs = text_content.to_skia_paragraphs(&self.fonts.font_collection());
+
+ shadows::render_text_drop_shadows(self, &shape, ¶graphs, antialias);
+ text::render(self, &shape, ¶graphs, None, None);
+ shadows::render_text_inner_shadows(self, &shape, ¶graphs, antialias);
}
_ => {
self.surfaces.apply_mut(
- &[SurfaceId::Fills, SurfaceId::Strokes, SurfaceId::DropShadows],
+ &[
+ SurfaceId::Fills,
+ SurfaceId::Strokes,
+ SurfaceId::DropShadows,
+ SurfaceId::InnerShadows,
+ ],
|s| {
s.canvas().concat(&matrix);
},
);
for fill in shape.fills().rev() {
- fills::render(self, &shape, fill);
+ fills::render(self, &shape, fill, antialias);
}
for stroke in shape.strokes().rev() {
- strokes::render(self, &shape, stroke);
+ shadows::render_stroke_drop_shadows(self, &shape, stroke, antialias);
+ strokes::render(self, &shape, stroke, None, None, antialias);
+ shadows::render_stroke_inner_shadows(self, &shape, stroke, antialias);
}
- for shadow in shape.inner_shadows().rev().filter(|s| !s.hidden()) {
- shadows::render_inner_shadow(
- self,
- shadow,
- self.viewbox.zoom * self.options.dpr(),
- shape.fills().len() > 0,
- );
- }
-
- shadows::render_drop_shadows(self, &shape);
+ shadows::render_fill_inner_shadows(self, &shape, antialias);
+ shadows::render_fill_drop_shadows(self, &shape, antialias);
}
};
- self.apply_drawing_to_render_canvas(&shape);
+ self.apply_drawing_to_render_canvas(Some(&shape));
self.surfaces.apply_mut(
- &[SurfaceId::Fills, SurfaceId::Strokes, SurfaceId::DropShadows],
+ &[
+ SurfaceId::Fills,
+ SurfaceId::Strokes,
+ SurfaceId::DropShadows,
+ SurfaceId::InnerShadows,
+ ],
|s| {
s.canvas().restore();
},
);
}
+ pub fn update_render_context(&mut self, tile: tiles::Tile) {
+ self.current_tile = Some(tile);
+ self.render_area = tiles::get_tile_rect(self.viewbox, tile);
+ self.surfaces
+ .update_render_context(self.render_area, self.viewbox);
+ }
+
pub fn start_render_loop(
&mut self,
tree: &mut HashMap,
modifiers: &HashMap,
+ structure: &HashMap>,
timestamp: i32,
) -> Result<(), String> {
if self.render_in_progress {
if let Some(frame_id) = self.render_request_id {
- self.cancel_animation_frame(frame_id);
+ wapi::cancel_animation_frame!(frame_id);
}
}
+ performance::begin_measure!("render");
+ performance::begin_measure!("start_render_loop");
+ let scale = self.get_scale();
self.reset_canvas();
self.surfaces.apply_mut(
- &[SurfaceId::Fills, SurfaceId::Strokes, SurfaceId::DropShadows],
+ &[
+ SurfaceId::Fills,
+ SurfaceId::Strokes,
+ SurfaceId::DropShadows,
+ SurfaceId::InnerShadows,
+ ],
|s| {
- s.canvas().scale((
- self.viewbox.zoom * self.options.dpr(),
- self.viewbox.zoom * self.options.dpr(),
- ));
- s.canvas()
- .translate((self.viewbox.pan_x, self.viewbox.pan_y));
+ s.canvas().scale((scale, scale));
},
);
- self.pending_nodes = vec![NodeRenderState {
- id: Uuid::nil(),
- visited_children: false,
- clip_bounds: None,
- visited_mask: false,
- mask: false,
- }];
- self.render_in_progress = true;
- self.process_animation_frame(tree, modifiers, timestamp)?;
- self.render_complete = true;
- Ok(())
- }
+ // First we retrieve the extended area of the viewport that we could render.
+ let (isx, isy, iex, iey) = tiles::get_tiles_for_viewbox_with_interest(
+ self.viewbox,
+ VIEWPORT_INTEREST_AREA_THRESHOLD,
+ );
+ // Then we get the real amount of tiles rendered for the current viewbox.
+ let (sx, sy, ex, ey) = tiles::get_tiles_for_viewbox(self.viewbox);
+ debug::render_debug_tiles_for_viewbox(self, isx, isy, iex, iey);
+ let tile_center = ((iex - isx) / 2, (iey - isy) / 2);
- pub fn request_animation_frame(&mut self) -> i32 {
- let script =
- std::ffi::CString::new("requestAnimationFrame(_process_animation_frame)").unwrap();
- unsafe { emscripten_run_script_int(script.as_ptr()) }
- }
-
- pub fn cancel_animation_frame(&mut self, frame_id: i32) {
- let cancel_script = format!("cancelAnimationFrame({})", frame_id);
- let c_cancel_script = std::ffi::CString::new(cancel_script).unwrap();
- unsafe {
- emscripten_run_script(c_cancel_script.as_ptr());
+ performance::begin_measure!("tile_cache");
+ self.pending_tiles = vec![];
+ self.surfaces.cache_clear_visited();
+ for y in isy..=iey {
+ for x in isx..=iex {
+ let tile = (x, y);
+ let distance = tiles::manhattan_distance(tile, tile_center);
+ self.pending_tiles.push((x, y, distance));
+ // We only need to mark! as visited the visible
+ // tiles, the ones that are outside the viewport
+ // should not be rendered.
+ if x >= sx && x <= ex && y >= sy && y <= ey {
+ self.surfaces.cache_visit(tile);
+ }
+ }
}
+ performance::end_measure!("tile_cache");
+
+ self.pending_nodes = VecDeque::new();
+ // reorder by distance to the center.
+ self.pending_tiles.sort_by(|a, b| b.2.cmp(&a.2));
+ self.current_tile = None;
+ self.render_in_progress = true;
+ self.apply_drawing_to_render_canvas(None);
+ self.process_animation_frame(tree, modifiers, structure, timestamp)?;
+ performance::end_measure!("start_render_loop");
+ Ok(())
}
pub fn process_animation_frame(
&mut self,
tree: &mut HashMap,
modifiers: &HashMap,
+ structure: &HashMap>,
timestamp: i32,
) -> Result<(), String> {
+ performance::begin_measure!("process_animation_frame");
if self.render_in_progress {
- self.render_shape_tree(tree, modifiers, timestamp)?;
+ self.render_shape_tree(tree, modifiers, structure, timestamp)?;
+ self.flush();
+
if self.render_in_progress {
if let Some(frame_id) = self.render_request_id {
- self.cancel_animation_frame(frame_id);
+ wapi::cancel_animation_frame!(frame_id);
}
- self.render_request_id = Some(self.request_animation_frame());
+ self.render_request_id = Some(wapi::request_animation_frame!());
+ } else {
+ performance::end_measure!("render");
}
}
-
- // self.render_in_progress can have changed
- if self.render_in_progress {
- if self.cached_surface_image.is_some() {
- self.render_from_cache()?;
- }
- return Ok(());
- }
-
- // Chech if cached_surface_image is not set or is invalid
- if self
- .cached_surface_image
- .as_ref()
- .is_none_or(|img| img.invalid)
- {
- self.cached_surface_image = Some(CachedSurfaceImage {
- image: self.surfaces.snapshot(SurfaceId::Current),
- viewbox: self.viewbox,
- invalid: false,
- has_all_shapes: self.render_complete,
- });
- }
-
- if self.options.is_debug_visible() {
- self.render_debug();
- }
-
- debug::render_wasm_label(self);
- self.apply_render_to_final_canvas();
- self.flush();
+ performance::end_measure!("process_animation_frame");
Ok(())
}
- pub fn clear_cache(&mut self) {
- self.cached_surface_image = None;
- }
-
- pub fn render_from_cache(&mut self) -> Result<(), String> {
- let cached = self
- .cached_surface_image
- .as_ref()
- .ok_or("Uninitialized cached surface image")?;
-
- let image = &cached.image;
- let paint = skia::Paint::default();
- self.surfaces.canvas(SurfaceId::Target).save();
- self.surfaces.canvas(SurfaceId::Fills).save();
- self.surfaces.canvas(SurfaceId::Strokes).save();
- self.surfaces.canvas(SurfaceId::DropShadows).save();
-
- let navigate_zoom = self.viewbox.zoom / cached.viewbox.zoom;
- let navigate_x = cached.viewbox.zoom * (self.viewbox.pan_x - cached.viewbox.pan_x);
- let navigate_y = cached.viewbox.zoom * (self.viewbox.pan_y - cached.viewbox.pan_y);
-
- self.surfaces
- .canvas(SurfaceId::Target)
- .scale((navigate_zoom, navigate_zoom));
- self.surfaces.canvas(SurfaceId::Target).translate((
- navigate_x * self.options.dpr(),
- navigate_y * self.options.dpr(),
- ));
- self.surfaces
- .canvas(SurfaceId::Target)
- .clear(self.background_color);
- self.surfaces
- .canvas(SurfaceId::Target)
- .draw_image(image, (0, 0), Some(&paint));
-
- self.surfaces.canvas(SurfaceId::Target).restore();
- self.surfaces.canvas(SurfaceId::Fills).restore();
- self.surfaces.canvas(SurfaceId::Strokes).restore();
- self.surfaces.canvas(SurfaceId::DropShadows).restore();
-
- self.flush();
-
- Ok(())
- }
-
- fn render_debug(&mut self) {
- debug::render(self);
- }
-
pub fn render_shape_enter(&mut self, element: &mut Shape, mask: bool) {
// Masked groups needs two rendering passes, the first one rendering
// the content and the second one rendering the mask so we need to do
- // an extra save_layer to keep all the masked group separate from other
- // already drawn elements.
+ // an extra save_layer to keep all the masked group separate from
+ // other already drawn elements.
match element.shape_type {
Type::Group(group) => {
if group.masked {
@@ -594,7 +553,7 @@ impl RenderState {
.save_layer(&mask_rec);
}
- if let Some(image_filter) = element.image_filter(self.viewbox.zoom * self.options.dpr()) {
+ if let Some(image_filter) = element.image_filter(self.get_scale()) {
paint.set_image_filter(image_filter);
}
@@ -621,118 +580,349 @@ impl RenderState {
self.surfaces.canvas(SurfaceId::Current).restore();
}
+ pub fn get_current_tile_bounds(&mut self) -> Rect {
+ let (tile_x, tile_y) = self.current_tile.unwrap();
+ let scale = self.get_scale();
+ let offset_x = self.viewbox.area.left * scale;
+ let offset_y = self.viewbox.area.top * scale;
+ Rect::from_xywh(
+ (tile_x as f32 * tiles::TILE_SIZE) - offset_x,
+ (tile_y as f32 * tiles::TILE_SIZE) - offset_y,
+ tiles::TILE_SIZE,
+ tiles::TILE_SIZE,
+ )
+ }
+
pub fn render_shape_tree(
&mut self,
tree: &mut HashMap,
modifiers: &HashMap,
+ structure: &HashMap>,
timestamp: i32,
) -> Result<(), String> {
if !self.render_in_progress {
return Ok(());
}
- let mut i = 0;
- while let Some(node_render_state) = self.pending_nodes.pop() {
- let NodeRenderState {
- id: node_id,
- visited_children,
- clip_bounds,
- visited_mask,
- mask,
- } = node_render_state;
- let element = tree.get_mut(&node_id).ok_or(
- "Error: Element with root_id {node_render_state.id} not found in the tree."
- .to_string(),
- )?;
+ let scale = self.get_scale();
+ let mut should_stop = false;
- let render_complete = self.viewbox.area.contains(element.selrect());
- if visited_children {
- if !visited_mask {
- match element.shape_type {
- Type::Group(group) => {
- // When we're dealing with masked groups we need to
- // do a separate extra step to draw the mask (the last
- // element of a masked group) and blend (using
- // the blend mode 'destination-in') the content
- // of the group and the mask.
- if group.masked {
- self.pending_nodes.push(NodeRenderState {
- id: node_id,
- visited_children: true,
- clip_bounds: None,
- visited_mask: true,
- mask: false,
- });
- if let Some(&mask_id) = element.mask_id() {
- self.pending_nodes.push(NodeRenderState {
- id: mask_id,
- visited_children: false,
- clip_bounds: None,
- visited_mask: false,
- mask: true,
- });
+ while !should_stop {
+ if let Some(current_tile) = self.current_tile {
+ if self.surfaces.has_cached_tile_surface(current_tile) {
+ performance::begin_measure!("render_shape_tree::cached");
+ let tile_rect = self.get_current_tile_bounds();
+ self.surfaces
+ .draw_cached_tile_surface(current_tile, tile_rect);
+ performance::end_measure!("render_shape_tree::cached");
+
+ if self.options.is_debug_visible() {
+ debug::render_workspace_current_tile(
+ self,
+ "Cached".to_string(),
+ current_tile,
+ tile_rect,
+ );
+ }
+ } else {
+ performance::begin_measure!("render_shape_tree::uncached");
+ let mut i = 0;
+ let mut is_empty = true;
+ while let Some(node_render_state) = self.pending_nodes.pop_front() {
+ let NodeRenderState {
+ id: node_id,
+ visited_children,
+ clip_bounds,
+ visited_mask,
+ mask,
+ } = node_render_state;
+
+ is_empty = false;
+ let element = tree.get_mut(&node_id).ok_or(
+ "Error: Element with root_id {node_render_state.id} not found in the tree."
+ .to_string(),
+ )?;
+
+ // If the shape is not in the tile set, then we update
+ // it.
+ if let None = self.tiles.get_tiles_of(node_id) {
+ self.update_tile_for(element);
+ }
+
+ if visited_children {
+ if !visited_mask {
+ match element.shape_type {
+ Type::Group(group) => {
+ // When we're dealing with masked groups we need to
+ // do a separate extra step to draw the mask (the last
+ // element of a masked group) and blend (using
+ // the blend mode 'destination-in') the content
+ // of the group and the mask.
+ if group.masked {
+ self.pending_nodes.push_back(NodeRenderState {
+ id: node_id,
+ visited_children: true,
+ clip_bounds: None,
+ visited_mask: true,
+ mask: false,
+ });
+ if let Some(&mask_id) = element.mask_id() {
+ self.pending_nodes.push_back(NodeRenderState {
+ id: mask_id,
+ visited_children: false,
+ clip_bounds: None,
+ visited_mask: false,
+ mask: true,
+ });
+ }
+ }
+ }
+ _ => {}
}
}
+ self.render_shape_exit(element, visited_mask);
+ continue;
}
- _ => {}
+
+ if !node_render_state.id.is_nil() {
+ // If we didn't visited_children this shape, then we need to do
+ let mut transformed_element = element.clone();
+ if let Some(modifier) = modifiers.get(&node_id) {
+ transformed_element.apply_transform(modifier);
+ }
+ if !transformed_element.extrect().intersects(self.render_area)
+ || transformed_element.hidden()
+ || transformed_element.visually_insignificant(scale)
+ {
+ debug::render_debug_shape(self, &transformed_element, false);
+ continue;
+ } else {
+ debug::render_debug_shape(self, &transformed_element, true);
+ }
+ }
+
+ self.render_shape_enter(element, mask);
+ if !node_render_state.id.is_nil() {
+ self.render_shape(element, modifiers.get(&element.id), clip_bounds);
+ } else {
+ self.apply_drawing_to_render_canvas(Some(&element));
+ }
+
+ // Set the node as visited_children before processing children
+ self.pending_nodes.push_back(NodeRenderState {
+ id: node_id,
+ visited_children: true,
+ clip_bounds: None,
+ visited_mask: false,
+ mask: mask,
+ });
+
+ if element.is_recursive() {
+ let children_clip_bounds = node_render_state
+ .get_children_clip_bounds(element, modifiers.get(&element.id));
+
+ let mut children_ids =
+ modified_children_ids(element, structure.get(&element.id));
+
+ // Z-index ordering on Layouts
+ if element.has_layout() {
+ children_ids.sort_by(|id1, id2| {
+ let z1 = tree.get(id1).map_or_else(|| 0, |s| s.z_index());
+ let z2 = tree.get(id2).map_or_else(|| 0, |s| s.z_index());
+ z1.cmp(&z2)
+ });
+ }
+
+ for child_id in children_ids.iter().rev() {
+ self.pending_nodes.push_back(NodeRenderState {
+ id: *child_id,
+ visited_children: false,
+ clip_bounds: children_clip_bounds,
+ visited_mask: false,
+ mask: false,
+ });
+ }
+ }
+
+ // We try to avoid doing too many calls to get_time
+ if i % NODE_BATCH_THRESHOLD == 0
+ && performance::get_time() - timestamp > MAX_BLOCKING_TIME_MS
+ {
+ return Ok(());
+ }
+ i += 1;
+ }
+ performance::end_measure!("render_shape_tree::uncached");
+ let tile_rect = self.get_current_tile_bounds();
+ if !is_empty {
+ self.apply_render_to_final_canvas(tile_rect);
+ } else {
+ self.surfaces.apply_mut(&[SurfaceId::Target], |s| {
+ let mut paint = skia::Paint::default();
+ paint.set_color(self.background_color);
+ s.canvas().draw_rect(tile_rect, &paint);
+ });
}
}
- self.render_shape_exit(element, visited_mask);
- continue;
}
- // If we didn't visited_children this shape, then we need to do
- if !node_render_state.id.is_nil() {
- if !element.selrect().intersects(self.viewbox.area) || element.hidden() {
- debug::render_debug_shape(self, element, false);
- self.render_complete = render_complete;
- continue;
- } else {
- debug::render_debug_shape(self, element, true);
+ self.surfaces
+ .canvas(SurfaceId::Current)
+ .clear(self.background_color);
+
+ let Some(root) = tree.get(&Uuid::nil()) else {
+ return Err(String::from("Root shape not found"));
+ };
+ let root_ids = modified_children_ids(&root, structure.get(&root.id));
+
+ // If we finish processing every node rendering is complete
+ // let's check if there are more pending nodes
+ if let Some(next_tile_with_distance) = self.pending_tiles.pop() {
+ let (x, y, _) = next_tile_with_distance;
+ let next_tile = (x, y);
+ self.update_render_context(next_tile);
+
+ if !self.surfaces.has_cached_tile_surface(next_tile) {
+ if let Some(ids) = self.tiles.get_shapes_at(next_tile) {
+ // We only need first level shapes
+ let mut valid_ids: Vec = ids
+ .iter()
+ .filter_map(|id| root_ids.get(id).map(|_| *id))
+ .collect();
+
+ // These shapes for the tile should be ordered as they are in the parent node
+ valid_ids.sort_by_key(|id| root_ids.get_index_of(id));
+
+ self.pending_nodes.extend(valid_ids.into_iter().map(|id| {
+ NodeRenderState {
+ id,
+ visited_children: false,
+ clip_bounds: None,
+ visited_mask: false,
+ mask: false,
+ }
+ }));
+ }
}
- }
-
- self.render_shape_enter(element, mask);
- if !node_render_state.id.is_nil() {
- self.render_shape(element, modifiers.get(&element.id), clip_bounds);
} else {
- self.apply_drawing_to_render_canvas(&element);
+ should_stop = true;
}
-
- // Set the node as visited_children before processing children
- self.pending_nodes.push(NodeRenderState {
- id: node_id,
- visited_children: true,
- clip_bounds: None,
- visited_mask: false,
- mask: mask,
- });
-
- if element.is_recursive() {
- let children_clip_bounds =
- node_render_state.get_children_clip_bounds(element, &modifiers);
-
- for child_id in element.children_ids().iter().rev() {
- self.pending_nodes.push(NodeRenderState {
- id: *child_id,
- visited_children: false,
- clip_bounds: children_clip_bounds,
- visited_mask: false,
- mask: false,
- });
- }
- }
-
- // We try to avoid doing too many calls to get_time
- if i % NODE_BATCH_THRESHOLD == 0 && get_time() - timestamp > MAX_BLOCKING_TIME_MS {
- return Ok(());
- }
-
- i += 1;
+ }
+ self.render_in_progress = false;
+ if self.options.is_debug_visible() {
+ debug::render(self);
}
- // If we finish processing every node rendering is complete
- self.render_in_progress = false;
+ debug::render_wasm_label(self);
+ self.flush();
+
Ok(())
}
+
+ pub fn get_tiles_for_shape(&mut self, shape: &Shape) -> (i32, i32, i32, i32) {
+ let tile_size = tiles::get_tile_size(self.viewbox);
+ tiles::get_tiles_for_rect(shape.extrect(), tile_size)
+ }
+
+ pub fn update_tile_for(&mut self, shape: &Shape) {
+ let (rsx, rsy, rex, rey) = self.get_tiles_for_shape(shape);
+ let new_tiles: HashSet<(i32, i32)> = (rsx..=rex)
+ .flat_map(|x| (rsy..=rey).map(move |y| (x, y)))
+ .collect();
+
+ // Update tiles where the shape was
+ if let Some(tiles) = self.tiles.get_tiles_of(shape.id) {
+ for tile in tiles.iter() {
+ self.surfaces.remove_cached_tile_surface(*tile);
+ }
+ // Remove shape from tiles not used
+ let diff: HashSet<_> = tiles.difference(&new_tiles).cloned().collect();
+ for tile in diff.iter() {
+ self.tiles.remove_shape_at(*tile, shape.id);
+ }
+ }
+
+ // Update tiles matching the actual selrect
+ for tile in new_tiles {
+ self.tiles.add_shape_at(tile, shape.id);
+ self.surfaces.remove_cached_tile_surface(tile);
+ }
+ }
+
+ pub fn rebuild_tiles_shallow(
+ &mut self,
+ tree: &mut HashMap,
+ modifiers: &HashMap,
+ structure: &HashMap>,
+ ) {
+ performance::begin_measure!("rebuild_tiles_shallow");
+ self.tiles.invalidate();
+ self.surfaces.remove_cached_tiles();
+ let mut nodes = vec![Uuid::nil()];
+ while let Some(shape_id) = nodes.pop() {
+ if let Some(shape) = tree.get(&shape_id) {
+ let mut shape = shape.clone();
+ if shape_id != Uuid::nil() {
+ if let Some(modifier) = modifiers.get(&shape_id) {
+ shape.apply_transform(modifier);
+ }
+ self.update_tile_for(&shape);
+ } else {
+ // We only need to rebuild tiles from the first level.
+ let children = modified_children_ids(&shape, structure.get(&shape.id));
+ for child_id in children.iter() {
+ nodes.push(*child_id);
+ }
+ }
+ }
+ }
+ performance::end_measure!("rebuild_tiles_shallow");
+ }
+
+ pub fn rebuild_tiles(
+ &mut self,
+ tree: &mut HashMap,
+ modifiers: &HashMap,
+ structure: &HashMap>,
+ ) {
+ performance::begin_measure!("rebuild_tiles");
+ self.tiles.invalidate();
+ self.surfaces.remove_cached_tiles();
+ let mut nodes = vec![Uuid::nil()];
+ while let Some(shape_id) = nodes.pop() {
+ if let Some(shape) = tree.get(&shape_id) {
+ let mut shape = shape.clone();
+ if shape_id != Uuid::nil() {
+ if let Some(modifier) = modifiers.get(&shape_id) {
+ shape.apply_transform(modifier);
+ }
+ self.update_tile_for(&shape);
+ }
+
+ let children = modified_children_ids(&shape, structure.get(&shape.id));
+ for child_id in children.iter() {
+ nodes.push(*child_id);
+ }
+ }
+ }
+ performance::end_measure!("rebuild_tiles");
+ }
+
+ pub fn rebuild_modifier_tiles(
+ &mut self,
+ tree: &mut HashMap,
+ modifiers: &HashMap,
+ ) {
+ for (uuid, matrix) in modifiers {
+ if let Some(shape) = tree.get(uuid) {
+ let mut shape: Shape = shape.clone();
+ shape.apply_transform(matrix);
+ self.update_tile_for(&shape);
+ }
+ }
+ }
+
+ pub fn get_scale(&self) -> f32 {
+ self.viewbox.zoom() * self.options.dpr()
+ }
}
diff --git a/render-wasm/src/render/cache.rs b/render-wasm/src/render/cache.rs
deleted file mode 100644
index 04c0ec6433..0000000000
--- a/render-wasm/src/render/cache.rs
+++ /dev/null
@@ -1,18 +0,0 @@
-use super::{Image, Viewbox};
-use skia::Contains;
-use skia_safe as skia;
-
-pub(crate) struct CachedSurfaceImage {
- pub image: Image,
- pub viewbox: Viewbox,
- pub invalid: bool,
- pub has_all_shapes: bool,
-}
-
-impl CachedSurfaceImage {
- pub fn invalidate_if_dirty(&mut self, viewbox: &Viewbox) {
- if !self.has_all_shapes && !self.viewbox.area.contains(viewbox.area) {
- self.invalid = true;
- }
- }
-}
diff --git a/render-wasm/src/render/debug.rs b/render-wasm/src/render/debug.rs
index 176f1aec60..230464139d 100644
--- a/render-wasm/src/render/debug.rs
+++ b/render-wasm/src/render/debug.rs
@@ -1,71 +1,216 @@
use crate::shapes::Shape;
-use skia_safe as skia;
+use skia_safe::{self as skia, Rect};
-use super::{RenderState, SurfaceId};
+use super::{tiles, RenderState, SurfaceId};
+
+#[cfg(target_arch = "wasm32")]
+use crate::run_script;
+
+const DEBUG_SCALE: f32 = 0.2;
+
+fn get_debug_rect(rect: Rect) -> Rect {
+ skia::Rect::from_xywh(
+ 100. + rect.x() * DEBUG_SCALE,
+ 100. + rect.y() * DEBUG_SCALE,
+ rect.width() * DEBUG_SCALE,
+ rect.height() * DEBUG_SCALE,
+ )
+}
fn render_debug_view(render_state: &mut RenderState) {
let mut paint = skia::Paint::default();
paint.set_style(skia::PaintStyle::Stroke);
- paint.set_color(skia::Color::from_argb(255, 255, 0, 255));
+ paint.set_color(skia::Color::from_rgb(255, 0, 255));
paint.set_stroke_width(1.);
- let mut scaled_rect = render_state.viewbox.area.clone();
- let x = 100. + scaled_rect.x() * 0.2;
- let y = 100. + scaled_rect.y() * 0.2;
- let width = scaled_rect.width() * 0.2;
- let height = scaled_rect.height() * 0.2;
- scaled_rect.set_xywh(x, y, width, height);
-
+ let rect = get_debug_rect(render_state.viewbox.area.clone());
render_state
.surfaces
.canvas(SurfaceId::Debug)
- .draw_rect(scaled_rect, &paint);
+ .draw_rect(rect, &paint);
}
pub fn render_wasm_label(render_state: &mut RenderState) {
- let font_provider = render_state.fonts().font_provider();
- let typeface = font_provider
- .match_family_style("robotomono-regular", skia::FontStyle::default())
- .unwrap();
-
- let canvas = render_state.surfaces.canvas(SurfaceId::Current);
+ let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
let skia::ISize { width, height } = canvas.base_layer_size();
- let p = skia::Point::new(width as f32 - 100.0, height as f32 - 25.0);
let mut paint = skia::Paint::default();
paint.set_color(skia::Color::from_argb(100, 0, 0, 0));
- let font = skia::Font::new(typeface, 10.0);
- canvas.draw_str("WASM RENDERER", p, &font, &paint);
+ let str = if render_state.options.is_debug_visible() {
+ "WASM RENDERER (DEBUG)"
+ } else {
+ "WASM RENDERER"
+ };
+ let (scalar, _) = render_state.fonts.debug_font().measure_str(str, None);
+ let p = skia::Point::new(width as f32 - 25.0 - scalar, height as f32 - 25.0);
+
+ let debug_font = render_state.fonts.debug_font();
+ canvas.draw_str(str, p, &debug_font, &paint);
}
pub fn render_debug_shape(render_state: &mut RenderState, element: &Shape, intersected: bool) {
let mut paint = skia::Paint::default();
paint.set_style(skia::PaintStyle::Stroke);
paint.set_color(if intersected {
- skia::Color::from_argb(255, 255, 255, 0)
+ skia::Color::from_rgb(255, 255, 0)
} else {
- skia::Color::from_argb(255, 0, 255, 255)
+ skia::Color::from_rgb(0, 255, 255)
});
paint.set_stroke_width(1.);
- let mut scaled_rect = element.selrect();
- let x = 100. + scaled_rect.x() * 0.2;
- let y = 100. + scaled_rect.y() * 0.2;
- let width = scaled_rect.width() * 0.2;
- let height = scaled_rect.height() * 0.2;
- scaled_rect.set_xywh(x, y, width, height);
-
+ let rect = get_debug_rect(element.extrect());
render_state
.surfaces
.canvas(SurfaceId::Debug)
- .draw_rect(scaled_rect, &paint);
+ .draw_rect(rect, &paint);
+}
+
+pub fn render_debug_tiles_for_viewbox(
+ render_state: &mut RenderState,
+ sx: i32,
+ sy: i32,
+ ex: i32,
+ ey: i32,
+) {
+ let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
+ let mut paint = skia::Paint::default();
+ paint.set_style(skia::PaintStyle::Stroke);
+ paint.set_color(skia::Color::from_rgb(255, 0, 127));
+ paint.set_stroke_width(1.);
+ let str_rect = format!("{} {} {} {}", sx, sy, ex, ey);
+
+ let debug_font = render_state.fonts.debug_font();
+ canvas.draw_str(
+ str_rect,
+ skia::Point::new(100.0, 150.0),
+ &debug_font,
+ &paint,
+ );
+}
+
+// Renders the tiles in the viewbox
+pub fn render_debug_viewbox_tiles(render_state: &mut RenderState) {
+ let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
+ let mut paint = skia::Paint::default();
+ paint.set_style(skia::PaintStyle::Stroke);
+ paint.set_color(skia::Color::from_rgb(255, 0, 127));
+ paint.set_stroke_width(1.);
+
+ let tile_size = tiles::get_tile_size(render_state.viewbox);
+ let (sx, sy, ex, ey) = tiles::get_tiles_for_rect(render_state.viewbox.area, tile_size);
+ let str_rect = format!("{} {} {} {}", sx, sy, ex, ey);
+
+ let debug_font = render_state.fonts.debug_font();
+ canvas.draw_str(
+ str_rect,
+ skia::Point::new(100.0, 100.0),
+ &debug_font,
+ &paint,
+ );
+
+ for y in sy..=ey {
+ for x in sx..=ex {
+ let rect = Rect::from_xywh(
+ x as f32 * tile_size,
+ y as f32 * tile_size,
+ tile_size,
+ tile_size,
+ );
+ let debug_rect = get_debug_rect(rect);
+ let p = skia::Point::new(debug_rect.x(), debug_rect.y() - 1.);
+ let str = format!("{}:{}", x, y);
+ let debug_font = render_state.fonts.debug_font();
+ canvas.draw_str(str, p, &debug_font, &paint);
+ canvas.draw_rect(&debug_rect, &paint);
+ }
+ }
+}
+
+pub fn render_debug_tiles(render_state: &mut RenderState) {
+ let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
+ let mut paint = skia::Paint::default();
+ paint.set_style(skia::PaintStyle::Stroke);
+ paint.set_color(skia::Color::from_rgb(127, 0, 255));
+ paint.set_stroke_width(1.);
+
+ let tile_size = tiles::get_tile_size(render_state.viewbox);
+ let (sx, sy, ex, ey) = tiles::get_tiles_for_rect(render_state.viewbox.area, tile_size);
+ for y in sy..=ey {
+ for x in sx..=ex {
+ let tile = (x, y);
+ let shape_count = render_state.tiles.get_shapes_at(tile).iter().len();
+ if shape_count == 0 {
+ continue;
+ }
+
+ let rect = Rect::from_xywh(
+ x as f32 * tile_size,
+ y as f32 * tile_size,
+ tile_size,
+ tile_size,
+ );
+ let debug_rect = get_debug_rect(rect);
+ let p = skia::Point::new(debug_rect.x(), debug_rect.y() - 1.);
+ let str = format!("{}:{} {}", x, y, shape_count);
+
+ let debug_font = render_state.fonts.debug_font();
+ canvas.draw_str(str, p, &debug_font, &paint);
+ canvas.draw_rect(&debug_rect, &paint);
+ }
+ }
}
pub fn render(render_state: &mut RenderState) {
render_debug_view(render_state);
+ render_debug_viewbox_tiles(render_state);
+ render_debug_tiles(render_state);
render_state.surfaces.draw_into(
SurfaceId::Debug,
- SurfaceId::Current,
+ SurfaceId::Target,
Some(&skia::Paint::default()),
);
}
+
+#[cfg(target_arch = "wasm32")]
+#[allow(dead_code)]
+pub fn console_debug_surface(render_state: &mut RenderState, id: SurfaceId) {
+ let base64_image = render_state.surfaces.base64_snapshot(id);
+
+ run_script!(format!("console.log('%c ', 'font-size: 1px; background: url(data:image/png;base64,{base64_image}) no-repeat; padding: 100px; background-size: contain;')"))
+}
+
+#[allow(dead_code)]
+#[cfg(target_arch = "wasm32")]
+pub fn console_debug_surface_rect(render_state: &mut RenderState, id: SurfaceId, rect: skia::Rect) {
+ let int_rect = skia::IRect::from_ltrb(
+ rect.left as i32,
+ rect.top as i32,
+ rect.right as i32,
+ rect.bottom as i32,
+ );
+
+ let base64_image = render_state.surfaces.base64_snapshot_rect(id, int_rect);
+
+ if let Some(base64_image) = base64_image {
+ run_script!(format!("console.log('%c ', 'font-size: 1px; background: url(data:image/png;base64,{base64_image}) no-repeat; padding: 100px; background-size: contain;')"))
+ }
+}
+
+pub fn render_workspace_current_tile(
+ render_state: &mut RenderState,
+ prefix: String,
+ tile: tiles::Tile,
+ rect: skia::Rect,
+) {
+ let canvas = render_state.surfaces.canvas(SurfaceId::Target);
+ let mut p = skia::Paint::default();
+ p.set_stroke_width(1.);
+ p.set_style(skia::PaintStyle::Stroke);
+ canvas.draw_rect(&rect, &p);
+
+ let point = skia::Point::new(rect.x() + 10., rect.y() + 20.);
+ p.set_stroke_width(1.);
+ let str = format!("{prefix} {}:{}", tile.0, tile.1);
+ let debug_font = render_state.fonts.debug_font();
+ canvas.draw_str(str, point, &debug_font, &p);
+}
diff --git a/render-wasm/src/render/fills.rs b/render-wasm/src/render/fills.rs
index 1efdc8fd82..3bdf61d334 100644
--- a/render-wasm/src/render/fills.rs
+++ b/render-wasm/src/render/fills.rs
@@ -9,6 +9,7 @@ fn draw_image_fill(
shape: &Shape,
image_fill: &ImageFill,
paint: &Paint,
+ antialias: bool,
) {
let image = render_state.images.get(&image_fill.id());
if image.is_none() {
@@ -62,15 +63,15 @@ fn draw_image_fill(
..
}) => {
let rrect: RRect = RRect::new_rect_radii(container, &corners);
- canvas.clip_rrect(rrect, skia::ClipOp::Intersect, true);
+ canvas.clip_rrect(rrect, skia::ClipOp::Intersect, antialias);
}
Type::Rect(_) | Type::Frame(_) => {
- canvas.clip_rect(container, skia::ClipOp::Intersect, true);
+ canvas.clip_rect(container, skia::ClipOp::Intersect, antialias);
}
Type::Circle => {
let mut oval_path = skia::Path::new();
oval_path.add_oval(container, None);
- canvas.clip_path(&oval_path, skia::ClipOp::Intersect, true);
+ canvas.clip_path(&oval_path, skia::ClipOp::Intersect, antialias);
}
shape_type @ (Type::Path(_) | Type::Bool(_)) => {
if let Some(path) = shape_type.path() {
@@ -78,13 +79,13 @@ fn draw_image_fill(
canvas.clip_path(
&path.to_skia_path().transform(&path_transform),
skia::ClipOp::Intersect,
- true,
+ antialias,
);
}
}
}
Type::SVGRaw(_) => {
- canvas.clip_rect(container, skia::ClipOp::Intersect, true);
+ canvas.clip_rect(container, skia::ClipOp::Intersect, antialias);
}
Type::Group(_) => unreachable!("A group should not have fills"),
Type::Text(_) => unimplemented!("TODO"),
@@ -108,12 +109,12 @@ fn draw_image_fill(
/**
* This SHOULD be the only public function in this module.
*/
-pub fn render(render_state: &mut RenderState, shape: &Shape, fill: &Fill) {
- let paint = &fill.to_paint(&shape.selrect);
+pub fn render(render_state: &mut RenderState, shape: &Shape, fill: &Fill, antialias: bool) {
+ let paint = &fill.to_paint(&shape.selrect, antialias);
match (fill, &shape.shape_type) {
(Fill::Image(image_fill), _) => {
- draw_image_fill(render_state, shape, image_fill, paint);
+ draw_image_fill(render_state, shape, image_fill, paint, antialias);
}
(_, Type::Rect(_) | Type::Frame(_)) => {
render_state
diff --git a/render-wasm/src/render/fonts.rs b/render-wasm/src/render/fonts.rs
index 0dd881181d..dd8d24f2b3 100644
--- a/render-wasm/src/render/fonts.rs
+++ b/render-wasm/src/render/fonts.rs
@@ -1,41 +1,55 @@
-use skia_safe::{self as skia, textlayout, FontMgr};
+use skia_safe::{self as skia, textlayout, Font, FontMgr};
-use crate::shapes::FontFamily;
+use crate::shapes::{FontFamily, FontStyle};
+use crate::uuid::Uuid;
-const DEFAULT_FONT_BYTES: &[u8] = include_bytes!("../fonts/RobotoMono-Regular.ttf");
const EMOJI_FONT_BYTES: &[u8] = include_bytes!("../fonts/NotoColorEmoji-Regular.ttf");
-pub static DEFAULT_FONT: &'static str = "robotomono-regular";
pub static DEFAULT_EMOJI_FONT: &'static str = "noto-color-emoji";
+const DEFAULT_FONT_BYTES: &[u8] = include_bytes!("../fonts/sourcesanspro-regular.ttf");
+
+pub fn default_font() -> String {
+ let family = FontFamily::new(default_font_uuid(), 400, FontStyle::Normal);
+ format!("{}", family)
+}
+
+fn default_font_uuid() -> Uuid {
+ Uuid::nil()
+}
+
pub struct FontStore {
- // TODO: we should probably have just one of those
+ font_mgr: FontMgr,
font_provider: textlayout::TypefaceFontProvider,
font_collection: textlayout::FontCollection,
+ debug_font: Font,
}
impl FontStore {
pub fn new() -> Self {
- let mut font_provider = skia::textlayout::TypefaceFontProvider::new();
+ let font_mgr = FontMgr::new();
- let default_font = skia::FontMgr::default()
- .new_from_data(DEFAULT_FONT_BYTES, None)
- .expect("Failed to load font");
+ let mut font_provider = load_default_provider(&font_mgr);
- font_provider.register_typeface(default_font, DEFAULT_FONT);
-
- let emoji_font = skia::FontMgr::default()
+ // TODO: Load emoji font lazily
+ let emoji_font = font_mgr
.new_from_data(EMOJI_FONT_BYTES, None)
.expect("Failed to load font");
-
font_provider.register_typeface(emoji_font, DEFAULT_EMOJI_FONT);
let mut font_collection = skia::textlayout::FontCollection::new();
- font_collection.set_default_font_manager(FontMgr::default(), None);
- font_collection.set_dynamic_font_manager(FontMgr::from(font_provider.clone()));
+ font_collection.set_default_font_manager(FontMgr::from(font_provider.clone()), None);
+
+ let debug_typeface = font_provider
+ .match_family_style(default_font().as_str(), skia::FontStyle::default())
+ .unwrap();
+
+ let debug_font = skia::Font::new(debug_typeface, 10.0);
Self {
+ font_mgr,
font_provider,
font_collection,
+ debug_font,
}
}
@@ -47,20 +61,25 @@ impl FontStore {
&self.font_collection
}
+ pub fn debug_font(&self) -> &Font {
+ &self.debug_font
+ }
+
pub fn add(&mut self, family: FontFamily, font_data: &[u8]) -> Result<(), String> {
if self.has_family(&family) {
return Ok(());
}
let alias = format!("{}", family);
- let typeface = skia::FontMgr::default()
+ let typeface = self
+ .font_mgr
.new_from_data(font_data, None)
.ok_or("Failed to create typeface")?;
self.font_provider
.register_typeface(typeface, alias.as_str());
- self.refresh_font_collection();
+ self.font_collection.clear_caches();
Ok(())
}
@@ -69,12 +88,16 @@ impl FontStore {
let serialized = format!("{}", family);
self.font_provider.family_names().any(|x| x == serialized)
}
-
- fn refresh_font_collection(&mut self) {
- self.font_collection = skia::textlayout::FontCollection::new();
- self.font_collection
- .set_default_font_manager(FontMgr::default(), None);
- self.font_collection
- .set_dynamic_font_manager(FontMgr::from(self.font_provider.clone()));
- }
+}
+
+fn load_default_provider(font_mgr: &FontMgr) -> skia::textlayout::TypefaceFontProvider {
+ let mut font_provider = skia::textlayout::TypefaceFontProvider::new();
+
+ let family = FontFamily::new(default_font_uuid(), 400, FontStyle::Normal);
+ let font = font_mgr
+ .new_from_data(DEFAULT_FONT_BYTES, None)
+ .expect("Failed to load font");
+ font_provider.register_typeface(font, family.alias().as_str());
+
+ font_provider
}
diff --git a/render-wasm/src/render/images.rs b/render-wasm/src/render/images.rs
index a1d9f5fe76..138fc4a7f8 100644
--- a/render-wasm/src/render/images.rs
+++ b/render-wasm/src/render/images.rs
@@ -1,6 +1,9 @@
+use crate::math::Rect as MathRect;
+use crate::uuid::Uuid;
+
use skia_safe as skia;
+use skia_safe::gpu::{surfaces, Budgeted, DirectContext};
use std::collections::HashMap;
-use uuid::Uuid;
pub type Image = skia::Image;
@@ -15,11 +18,41 @@ impl ImageStore {
}
}
- pub fn add(&mut self, id: Uuid, image_data: &[u8]) -> Result<(), String> {
- let image_data = skia::Data::new_copy(image_data);
+ pub fn add(
+ &mut self,
+ id: Uuid,
+ image_data: &[u8],
+ context: &mut DirectContext,
+ ) -> Result<(), String> {
+ let image_data = unsafe { skia::Data::new_bytes(image_data) };
let image = Image::from_encoded(image_data).ok_or("Error decoding image data")?;
- self.images.insert(id, image);
+ let width = image.width();
+ let height = image.height();
+
+ let image_info = skia::ImageInfo::new_n32_premul((width, height), None);
+ let mut surface = surfaces::render_target(
+ context,
+ Budgeted::Yes,
+ &image_info,
+ None,
+ None,
+ None,
+ None,
+ false,
+ )
+ .ok_or("Can't create GPU surface")?;
+
+ let dest_rect = MathRect::from_xywh(0.0, 0.0, width as f32, height as f32);
+
+ surface
+ .canvas()
+ .draw_image_rect(&image, None, dest_rect, &skia::Paint::default());
+
+ let gpu_image = surface.image_snapshot();
+
+ // This way we store the image as a texture
+ self.images.insert(id, gpu_image);
Ok(())
}
diff --git a/render-wasm/src/render/options.rs b/render-wasm/src/render/options.rs
index 5e27f674b8..fc80bf2014 100644
--- a/render-wasm/src/render/options.rs
+++ b/render-wasm/src/render/options.rs
@@ -1,15 +1,15 @@
-use crate::debug;
+use crate::options;
#[derive(Debug, Copy, Clone, PartialEq)]
pub struct RenderOptions {
- pub debug_flags: u32,
+ pub flags: u32,
pub dpr: Option,
}
impl Default for RenderOptions {
fn default() -> Self {
Self {
- debug_flags: 0x00,
+ flags: 0x00,
dpr: None,
}
}
@@ -17,7 +17,11 @@ impl Default for RenderOptions {
impl RenderOptions {
pub fn is_debug_visible(&self) -> bool {
- self.debug_flags & debug::DEBUG_VISIBLE == debug::DEBUG_VISIBLE
+ self.flags & options::DEBUG_VISIBLE == options::DEBUG_VISIBLE
+ }
+
+ pub fn is_profile_rebuild_tiles(&self) -> bool {
+ self.flags & options::PROFILE_REBUILD_TILES == options::PROFILE_REBUILD_TILES
}
pub fn dpr(&self) -> f32 {
diff --git a/render-wasm/src/render/shadows.rs b/render-wasm/src/render/shadows.rs
index 17fca69d2d..d7a9e637e6 100644
--- a/render-wasm/src/render/shadows.rs
+++ b/render-wasm/src/render/shadows.rs
@@ -1,87 +1,164 @@
-use skia_safe::{self as skia};
-
use super::{RenderState, SurfaceId};
-use crate::shapes::{Shadow, Shape, Type};
+use crate::render::strokes;
+use crate::render::text::{self};
+use crate::shapes::{Shadow, Shape, Stroke, Type};
+use skia_safe::{textlayout::Paragraph, Paint};
-pub fn render_drop_shadows(render_state: &mut RenderState, shape: &Shape) {
- if shape.fills().len() > 0 {
+// Fill Shadows
+pub fn render_fill_drop_shadows(render_state: &mut RenderState, shape: &Shape, antialias: bool) {
+ if shape.has_fills() {
for shadow in shape.drop_shadows().rev().filter(|s| !s.hidden()) {
- render_fill_drop_shadow(render_state, &shape, &shadow);
- }
- } else {
- let scale = render_state.viewbox.zoom * render_state.options.dpr();
- for shadow in shape.drop_shadows().rev().filter(|s| !s.hidden()) {
- render_stroke_drop_shadow(render_state, &shadow, scale);
+ render_fill_drop_shadow(render_state, &shape, &shadow, antialias);
}
}
}
-fn render_fill_drop_shadow(render_state: &mut RenderState, shape: &Shape, shadow: &Shadow) {
- let paint = &shadow.get_drop_shadow_paint();
+fn render_fill_drop_shadow(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ shadow: &Shadow,
+ antialias: bool,
+) {
+ let paint = &shadow.get_drop_shadow_paint(antialias);
+ render_shadow_paint(render_state, shape, paint, SurfaceId::DropShadows);
+}
+pub fn render_fill_inner_shadows(render_state: &mut RenderState, shape: &Shape, antialias: bool) {
+ if shape.has_fills() {
+ for shadow in shape.inner_shadows().rev().filter(|s| !s.hidden()) {
+ render_fill_inner_shadow(render_state, &shape, &shadow, antialias);
+ }
+ }
+}
+
+fn render_fill_inner_shadow(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ shadow: &Shadow,
+ antialias: bool,
+) {
+ let paint = &shadow.get_inner_shadow_paint(antialias);
+ render_shadow_paint(render_state, shape, paint, SurfaceId::InnerShadows);
+}
+
+pub fn render_stroke_drop_shadows(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ stroke: &Stroke,
+ antialias: bool,
+) {
+ if !shape.has_fills() {
+ for shadow in shape.drop_shadows().rev().filter(|s| !s.hidden()) {
+ let filter = shadow.get_drop_shadow_filter();
+ strokes::render(
+ render_state,
+ &shape,
+ stroke,
+ Some(SurfaceId::Strokes), // FIXME
+ filter.as_ref(),
+ antialias,
+ )
+ }
+ }
+}
+
+pub fn render_stroke_inner_shadows(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ stroke: &Stroke,
+ antialias: bool,
+) {
+ if !shape.has_fills() {
+ for shadow in shape.inner_shadows().rev().filter(|s| !s.hidden()) {
+ let filter = shadow.get_inner_shadow_filter();
+ strokes::render(
+ render_state,
+ &shape,
+ stroke,
+ Some(SurfaceId::Strokes), // FIXME
+ filter.as_ref(),
+ antialias,
+ )
+ }
+ }
+}
+
+pub fn render_text_drop_shadows(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ paragraphs: &[Paragraph],
+ antialias: bool,
+) {
+ for shadow in shape.drop_shadows().rev().filter(|s| !s.hidden()) {
+ render_text_drop_shadow(render_state, &shape, &shadow, ¶graphs, antialias);
+ }
+}
+
+pub fn render_text_drop_shadow(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ shadow: &Shadow,
+ paragraphs: &[Paragraph],
+ antialias: bool,
+) {
+ let paint = &shadow.get_drop_shadow_paint(antialias);
+
+ text::render(
+ render_state,
+ shape,
+ ¶graphs,
+ Some(SurfaceId::DropShadows),
+ Some(paint),
+ );
+}
+
+pub fn render_text_inner_shadows(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ paragraphs: &[Paragraph],
+ antialias: bool,
+) {
+ for shadow in shape.inner_shadows().rev().filter(|s| !s.hidden()) {
+ render_text_inner_shadow(render_state, &shape, &shadow, ¶graphs, antialias);
+ }
+}
+
+pub fn render_text_inner_shadow(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ shadow: &Shadow,
+ paragraphs: &[Paragraph],
+ antialias: bool,
+) {
+ let paint = &shadow.get_inner_shadow_paint(antialias);
+
+ text::render(
+ render_state,
+ shape,
+ ¶graphs,
+ Some(SurfaceId::InnerShadows),
+ Some(paint),
+ );
+}
+
+fn render_shadow_paint(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ paint: &Paint,
+ surface_id: SurfaceId,
+) {
match &shape.shape_type {
Type::Rect(_) | Type::Frame(_) => {
- render_state
- .surfaces
- .draw_rect_to(SurfaceId::DropShadows, shape, paint);
+ render_state.surfaces.draw_rect_to(surface_id, shape, paint);
}
Type::Circle => {
render_state
.surfaces
- .draw_circle_to(SurfaceId::DropShadows, shape, paint);
+ .draw_circle_to(surface_id, shape, paint);
}
Type::Path(_) | Type::Bool(_) => {
- render_state
- .surfaces
- .draw_path_to(SurfaceId::DropShadows, shape, paint);
+ render_state.surfaces.draw_path_to(surface_id, shape, paint);
}
_ => {}
}
}
-
-fn render_stroke_drop_shadow(render_state: &mut RenderState, shadow: &Shadow, scale: f32) {
- let shadow_paint = &shadow.to_paint(scale);
-
- render_state
- .surfaces
- .draw_into(SurfaceId::Strokes, SurfaceId::Shadow, Some(shadow_paint));
-
- render_state.surfaces.draw_into(
- SurfaceId::Shadow,
- SurfaceId::Current,
- Some(&skia::Paint::default()),
- );
-
- render_state
- .surfaces
- .canvas(SurfaceId::Shadow)
- .clear(skia::Color::TRANSPARENT);
-}
-
-pub fn render_inner_shadow(
- render_state: &mut RenderState,
- shadow: &Shadow,
- scale: f32,
- render_over_fills: bool,
-) {
- let shadow_paint = shadow.to_paint(scale);
-
- if render_over_fills {
- render_state
- .surfaces
- .draw_into(SurfaceId::Fills, SurfaceId::Shadow, Some(&shadow_paint));
- } else {
- render_state
- .surfaces
- .draw_into(SurfaceId::Strokes, SurfaceId::Shadow, Some(&shadow_paint));
- }
-
- render_state
- .surfaces
- .draw_into(SurfaceId::Shadow, SurfaceId::Overlay, None);
-
- render_state
- .surfaces
- .canvas(SurfaceId::Shadow)
- .clear(skia::Color::TRANSPARENT);
-}
diff --git a/render-wasm/src/render/strokes.rs b/render-wasm/src/render/strokes.rs
index 48665ccddd..b906685ecb 100644
--- a/render-wasm/src/render/strokes.rs
+++ b/render-wasm/src/render/strokes.rs
@@ -3,7 +3,7 @@ use std::collections::HashMap;
use crate::math::{Matrix, Point, Rect};
use crate::shapes::{Corners, Fill, ImageFill, Path, Shape, Stroke, StrokeCap, StrokeKind, Type};
-use skia_safe::{self as skia, RRect};
+use skia_safe::{self as skia, ImageFilter, RRect};
use super::{RenderState, SurfaceId};
@@ -15,13 +15,19 @@ fn draw_stroke_on_rect(
corners: &Option,
svg_attrs: &HashMap,
scale: f32,
+ shadow: Option<&ImageFilter>,
+ antialias: bool,
) {
// Draw the different kind of strokes for a rect is straightforward, we just need apply a stroke to:
// - The same rect if it's a center stroke
// - A bigger rect if it's an outer stroke
// - A smaller rect if it's an outer stroke
let stroke_rect = stroke.outer_rect(rect);
- let paint = stroke.to_paint(selrect, svg_attrs, scale);
+ let mut paint = stroke.to_paint(selrect, svg_attrs, scale, antialias);
+
+ if let Some(filter) = shadow {
+ paint.set_image_filter(filter.clone());
+ }
match corners {
Some(radii) => {
@@ -42,16 +48,24 @@ fn draw_stroke_on_circle(
selrect: &Rect,
svg_attrs: &HashMap,
scale: f32,
+ shadow: Option<&ImageFilter>,
+ antialias: bool,
) {
// Draw the different kind of strokes for an oval is straightforward, we just need apply a stroke to:
// - The same oval if it's a center stroke
// - A bigger oval if it's an outer stroke
// - A smaller oval if it's an outer stroke
let stroke_rect = stroke.outer_rect(rect);
- canvas.draw_oval(&stroke_rect, &stroke.to_paint(selrect, svg_attrs, scale));
+ let mut paint = stroke.to_paint(selrect, svg_attrs, scale, antialias);
+
+ if let Some(filter) = shadow {
+ paint.set_image_filter(filter.clone());
+ }
+
+ canvas.draw_oval(&stroke_rect, &paint);
}
-fn draw_stroke_on_path(
+pub fn draw_stroke_on_path(
canvas: &skia::Canvas,
stroke: &Stroke,
path: &Path,
@@ -59,36 +73,45 @@ fn draw_stroke_on_path(
path_transform: Option<&Matrix>,
svg_attrs: &HashMap,
scale: f32,
+ shadow: Option<&ImageFilter>,
+ antialias: bool,
) {
let mut skia_path = path.to_skia_path();
skia_path.transform(path_transform.unwrap());
let is_open = path.is_open();
- let paint_stroke = stroke.to_stroked_paint(is_open, selrect, svg_attrs, scale);
+ let mut paint: skia_safe::Handle<_> =
+ stroke.to_stroked_paint(path.is_open(), selrect, svg_attrs, scale, antialias);
+
+ if let Some(filter) = shadow {
+ paint.set_image_filter(filter.clone());
+ }
+
// Draw the different kind of strokes for a path requires different strategies:
match stroke.render_kind(is_open) {
// For inner stroke we draw a center stroke (with double width) and clip to the original path (that way the extra outer stroke is removed)
StrokeKind::InnerStroke => {
- canvas.clip_path(&skia_path, skia::ClipOp::Intersect, true);
- canvas.draw_path(&skia_path, &paint_stroke);
+ canvas.save(); // As we are using clear for surfaces we use save and restore here to still be able to clean the full surface
+ canvas.clip_path(&skia_path, skia::ClipOp::Intersect, antialias);
+ canvas.draw_path(&skia_path, &paint);
+ canvas.restore();
}
// For center stroke we don't need to do anything extra
StrokeKind::CenterStroke => {
- canvas.draw_path(&skia_path, &paint_stroke);
+ canvas.draw_path(&skia_path, &paint);
}
// For outer stroke we draw a center stroke (with double width) and use another path with blend mode clear to remove the inner stroke added
StrokeKind::OuterStroke => {
- let mut paint = skia::Paint::default();
- paint.set_blend_mode(skia::BlendMode::SrcOver);
- paint.set_anti_alias(true);
- let layer_rec = skia::canvas::SaveLayerRec::default().paint(&paint);
+ let mut outer_paint = skia::Paint::default();
+ outer_paint.set_blend_mode(skia::BlendMode::SrcOver);
+ outer_paint.set_anti_alias(antialias);
+ let layer_rec = skia::canvas::SaveLayerRec::default().paint(&outer_paint);
canvas.save_layer(&layer_rec);
-
- canvas.draw_path(&skia_path, &paint_stroke);
+ canvas.draw_path(&skia_path, &paint);
let mut clear_paint = skia::Paint::default();
clear_paint.set_blend_mode(skia::BlendMode::Clear);
- clear_paint.set_anti_alias(true);
+ clear_paint.set_anti_alias(antialias);
canvas.draw_path(&skia_path, &clear_paint);
canvas.restore();
@@ -103,6 +126,7 @@ fn draw_stroke_on_path(
is_open,
svg_attrs,
scale,
+ antialias,
);
}
@@ -152,7 +176,8 @@ fn handle_stroke_caps(
canvas: &skia::Canvas,
is_open: bool,
svg_attrs: &HashMap,
- dpr_scale: f32,
+ scale: f32,
+ antialias: bool,
) {
let points_count = path.count_points();
let mut points = vec![Point::default(); points_count];
@@ -163,7 +188,8 @@ fn handle_stroke_caps(
let first_point = points.first().unwrap();
let last_point = points.last().unwrap();
- let mut paint_stroke = stroke.to_stroked_paint(is_open, selrect, svg_attrs, dpr_scale);
+ let mut paint_stroke =
+ stroke.to_stroked_paint(is_open, selrect, svg_attrs, scale, antialias);
handle_stroke_cap(
canvas,
@@ -323,6 +349,7 @@ fn draw_image_stroke_in_container(
shape: &Shape,
stroke: &Stroke,
image_fill: &ImageFill,
+ antialias: bool,
) {
let image = render_state.images.get(&image_fill.id());
if image.is_none() {
@@ -330,16 +357,16 @@ fn draw_image_stroke_in_container(
}
let size = image_fill.size();
- let canvas = render_state.surfaces.canvas(SurfaceId::Fills);
+ let scale = render_state.get_scale();
+ let canvas = render_state.surfaces.canvas(SurfaceId::Strokes);
let container = &shape.selrect;
let path_transform = shape.to_path_transform();
let svg_attrs = &shape.svg_attrs;
- let dpr_scale = render_state.viewbox.zoom * render_state.options.dpr();
// Save canvas and layer state
let mut pb = skia::Paint::default();
pb.set_blend_mode(skia::BlendMode::SrcOver);
- pb.set_anti_alias(true);
+ pb.set_anti_alias(antialias);
let layer_rec = skia::canvas::SaveLayerRec::default().paint(&pb);
canvas.save_layer(&layer_rec);
@@ -356,12 +383,21 @@ fn draw_image_stroke_in_container(
&outer_rect,
&shape_type.corners(),
svg_attrs,
- dpr_scale,
+ scale,
+ None,
+ antialias,
);
}
- Type::Circle => {
- draw_stroke_on_circle(canvas, stroke, container, &outer_rect, svg_attrs, dpr_scale)
- }
+ Type::Circle => draw_stroke_on_circle(
+ canvas,
+ stroke,
+ container,
+ &outer_rect,
+ svg_attrs,
+ scale,
+ None,
+ antialias,
+ ),
shape_type @ (Type::Path(_) | Type::Bool(_)) => {
if let Some(p) = shape_type.path() {
@@ -371,20 +407,21 @@ fn draw_image_stroke_in_container(
let stroke_kind = stroke.render_kind(p.is_open());
match stroke_kind {
StrokeKind::InnerStroke => {
- canvas.clip_path(&path, skia::ClipOp::Intersect, true);
+ canvas.clip_path(&path, skia::ClipOp::Intersect, antialias);
}
StrokeKind::CenterStroke => {}
StrokeKind::OuterStroke => {
- canvas.clip_path(&path, skia::ClipOp::Difference, true);
+ canvas.clip_path(&path, skia::ClipOp::Difference, antialias);
}
}
let is_open = p.is_open();
- let mut paint = stroke.to_stroked_paint(is_open, &outer_rect, svg_attrs, dpr_scale);
+ let mut paint =
+ stroke.to_stroked_paint(is_open, &outer_rect, svg_attrs, scale, antialias);
canvas.draw_path(&path, &paint);
- canvas.restore();
if stroke.render_kind(is_open) == StrokeKind::OuterStroke {
- // Small extra inner stroke to overlap with the fill and avoid unnecesary artifacts
- paint.set_stroke_width(1. / dpr_scale);
+ // Small extra inner stroke to overlap with the fill
+ // and avoid unnecesary artifacts.
+ paint.set_stroke_width(1. / scale);
canvas.draw_path(&path, &paint);
}
handle_stroke_caps(
@@ -394,23 +431,33 @@ fn draw_image_stroke_in_container(
canvas,
is_open,
svg_attrs,
- dpr_scale,
+ scale,
+ antialias,
);
+ canvas.restore();
}
}
_ => unreachable!("This shape should not have strokes"),
}
- // Draw the image. We are using now the SrcIn blend mode, so the rendered piece of image will the area of the stroke over the image.
+ // Draw the image. We are using now the SrcIn blend mode,
+ // so the rendered piece of image will the area of the
+ // stroke over the image.
let mut image_paint = skia::Paint::default();
image_paint.set_blend_mode(skia::BlendMode::SrcIn);
- image_paint.set_anti_alias(true);
+ image_paint.set_anti_alias(antialias);
// Compute scaled rect and clip to it
let dest_rect = calculate_scaled_rect(size, container, stroke.delta());
- canvas.clip_rect(dest_rect, skia::ClipOp::Intersect, true);
- canvas.draw_image_rect(image.unwrap(), None, dest_rect, &image_paint);
+ canvas.clip_rect(dest_rect, skia::ClipOp::Intersect, antialias);
+ canvas.draw_image_rect_with_sampling_options(
+ image.unwrap(),
+ None,
+ dest_rect,
+ render_state.sampling_options,
+ &image_paint,
+ );
// Clear outer stroke for paths if necessary. When adding an outer stroke we need to empty the stroke added too in the inner area.
if let Type::Path(p) = &shape.shape_type {
@@ -419,7 +466,7 @@ fn draw_image_stroke_in_container(
path.transform(&path_transform.unwrap());
let mut clear_paint = skia::Paint::default();
clear_paint.set_blend_mode(skia::BlendMode::Clear);
- clear_paint.set_anti_alias(true);
+ clear_paint.set_anti_alias(antialias);
canvas.draw_path(&path, &clear_paint);
}
}
@@ -431,15 +478,26 @@ fn draw_image_stroke_in_container(
/**
* This SHOULD be the only public function in this module.
*/
-pub fn render(render_state: &mut RenderState, shape: &Shape, stroke: &Stroke) {
- let canvas = render_state.surfaces.canvas(SurfaceId::Strokes);
- let dpr_scale = render_state.viewbox.zoom * render_state.options.dpr();
+pub fn render(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ stroke: &Stroke,
+ surface_id: Option,
+ shadow: Option<&ImageFilter>,
+ antialias: bool,
+) {
+ let scale = render_state.get_scale();
+ let canvas = render_state
+ .surfaces
+ .canvas(surface_id.unwrap_or(SurfaceId::Strokes));
let selrect = shape.selrect;
let path_transform = shape.to_path_transform();
let svg_attrs = &shape.svg_attrs;
- if let Fill::Image(image_fill) = &stroke.fill {
- draw_image_stroke_in_container(render_state, shape, stroke, image_fill);
+ if !shadow.is_some() && matches!(stroke.fill, Fill::Image(_)) {
+ if let Fill::Image(image_fill) = &stroke.fill {
+ draw_image_stroke_in_container(render_state, shape, stroke, image_fill, antialias);
+ }
} else {
match &shape.shape_type {
shape_type @ (Type::Rect(_) | Type::Frame(_)) => {
@@ -450,15 +508,16 @@ pub fn render(render_state: &mut RenderState, shape: &Shape, stroke: &Stroke) {
&selrect,
&shape_type.corners(),
svg_attrs,
- dpr_scale,
+ scale,
+ shadow,
+ antialias,
);
}
- Type::Circle => {
- draw_stroke_on_circle(canvas, stroke, &selrect, &selrect, &svg_attrs, dpr_scale)
- }
+ Type::Circle => draw_stroke_on_circle(
+ canvas, stroke, &selrect, &selrect, svg_attrs, scale, shadow, antialias,
+ ),
shape_type @ (Type::Path(_) | Type::Bool(_)) => {
if let Some(path) = shape_type.path() {
- let svg_attrs = &shape.svg_attrs;
draw_stroke_on_path(
canvas,
stroke,
@@ -466,7 +525,9 @@ pub fn render(render_state: &mut RenderState, shape: &Shape, stroke: &Stroke) {
&selrect,
path_transform.as_ref(),
svg_attrs,
- dpr_scale,
+ scale,
+ shadow,
+ antialias,
);
}
}
diff --git a/render-wasm/src/render/surfaces.rs b/render-wasm/src/render/surfaces.rs
index 8ff0db278a..a1c2cb02ca 100644
--- a/render-wasm/src/render/surfaces.rs
+++ b/render-wasm/src/render/surfaces.rs
@@ -1,6 +1,17 @@
-use super::gpu_state::GpuState;
use crate::shapes::Shape;
-use skia_safe::{self as skia, Paint, RRect};
+use crate::view::Viewbox;
+use skia_safe::{self as skia, IRect, Paint, RRect};
+
+use super::{gpu_state::GpuState, tiles::Tile};
+
+use base64::{engine::general_purpose, Engine as _};
+use std::collections::HashMap;
+
+const TEXTURES_CACHE_CAPACITY: usize = 512;
+const TEXTURES_BATCH_DELETE: usize = 32;
+// This is the amount of extra space we're going to give to all the surfaces to render shapes.
+// If it's too big it could affect performance.
+const TILE_SIZE_MULTIPLIER: i32 = 2;
#[derive(Debug, PartialEq, Clone, Copy)]
pub enum SurfaceId {
@@ -8,9 +19,8 @@ pub enum SurfaceId {
Current,
Fills,
Strokes,
- Shadow,
DropShadows,
- Overlay,
+ InnerShadows,
Debug,
}
@@ -24,42 +34,51 @@ pub struct Surfaces {
// keeps the current shape's strokes
shape_strokes: skia::Surface,
// used for rendering shadows
- shadow: skia::Surface,
- // used for new shadow rendering
drop_shadows: skia::Surface,
- // for drawing the things that are over shadows.
- overlay: skia::Surface,
+ // used fo rendering over shadows.
+ inner_shadows: skia::Surface,
// for drawing debug info.
debug: skia::Surface,
-
+ // for drawing tiles.
+ tiles: TileTextureCache,
sampling_options: skia::SamplingOptions,
+ margins: skia::ISize,
}
+#[allow(dead_code)]
impl Surfaces {
pub fn new(
gpu_state: &mut GpuState,
(width, height): (i32, i32),
sampling_options: skia::SamplingOptions,
+ tile_dims: skia::ISize,
) -> Self {
+ let extra_tile_dims = skia::ISize::new(
+ tile_dims.width * TILE_SIZE_MULTIPLIER,
+ tile_dims.height * TILE_SIZE_MULTIPLIER,
+ );
+ let margins = skia::ISize::new(extra_tile_dims.width / 4, extra_tile_dims.height / 4);
+
let mut target = gpu_state.create_target_surface(width, height);
- let current = target.new_surface_with_dimensions((width, height)).unwrap();
- let shadow = target.new_surface_with_dimensions((width, height)).unwrap();
- let drop_shadows = target.new_surface_with_dimensions((width, height)).unwrap();
- let overlay = target.new_surface_with_dimensions((width, height)).unwrap();
- let shape_fills = target.new_surface_with_dimensions((width, height)).unwrap();
- let shape_strokes = target.new_surface_with_dimensions((width, height)).unwrap();
+ let current = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
+ let drop_shadows = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
+ let inner_shadows = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
+ let shape_fills = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
+ let shape_strokes = target.new_surface_with_dimensions(extra_tile_dims).unwrap();
let debug = target.new_surface_with_dimensions((width, height)).unwrap();
+ let tiles = TileTextureCache::new();
Surfaces {
target,
current,
- shadow,
drop_shadows,
- overlay,
+ inner_shadows,
shape_fills,
shape_strokes,
debug,
+ tiles,
sampling_options,
+ margins,
}
}
@@ -67,8 +86,26 @@ impl Surfaces {
self.reset_from_target(gpu_state.create_target_surface(new_width, new_height));
}
- pub fn snapshot(&mut self, id: SurfaceId) -> skia::Image {
- self.get_mut(id).image_snapshot()
+ pub fn base64_snapshot(&mut self, id: SurfaceId) -> String {
+ let surface = self.get_mut(id);
+ let image = surface.image_snapshot();
+ let mut context = surface.direct_context();
+ let encoded_image = image
+ .encode(context.as_mut(), skia::EncodedImageFormat::PNG, None)
+ .unwrap();
+ general_purpose::STANDARD.encode(&encoded_image.as_bytes())
+ }
+
+ pub fn base64_snapshot_rect(&mut self, id: SurfaceId, irect: skia::IRect) -> Option {
+ let surface = self.get_mut(id);
+ if let Some(image) = surface.image_snapshot_with_bounds(irect) {
+ let mut context = surface.direct_context();
+ let encoded_image = image
+ .encode(context.as_mut(), skia::EncodedImageFormat::PNG, None)
+ .unwrap();
+ return Some(general_purpose::STANDARD.encode(&encoded_image.as_bytes()));
+ }
+ None
}
pub fn canvas(&mut self, id: SurfaceId) -> &skia::Canvas {
@@ -95,13 +132,32 @@ impl Surfaces {
}
}
+ pub fn update_render_context(&mut self, render_area: skia::Rect, viewbox: Viewbox) {
+ let translation = (
+ -render_area.left() + self.margins.width as f32 / viewbox.zoom,
+ -render_area.top() + self.margins.height as f32 / viewbox.zoom,
+ );
+ self.apply_mut(
+ &[
+ SurfaceId::Fills,
+ SurfaceId::Strokes,
+ SurfaceId::DropShadows,
+ SurfaceId::InnerShadows,
+ ],
+ |s| {
+ s.canvas().restore();
+ s.canvas().save();
+ s.canvas().translate(translation);
+ },
+ );
+ }
+
fn get_mut(&mut self, id: SurfaceId) -> &mut skia::Surface {
match id {
SurfaceId::Target => &mut self.target,
SurfaceId::Current => &mut self.current,
- SurfaceId::Shadow => &mut self.shadow,
SurfaceId::DropShadows => &mut self.drop_shadows,
- SurfaceId::Overlay => &mut self.overlay,
+ SurfaceId::InnerShadows => &mut self.inner_shadows,
SurfaceId::Fills => &mut self.shape_fills,
SurfaceId::Strokes => &mut self.shape_strokes,
SurfaceId::Debug => &mut self.debug,
@@ -111,12 +167,8 @@ impl Surfaces {
fn reset_from_target(&mut self, target: skia::Surface) {
let dim = (target.width(), target.height());
self.target = target;
- self.current = self.target.new_surface_with_dimensions(dim).unwrap();
- self.overlay = self.target.new_surface_with_dimensions(dim).unwrap();
- self.shadow = self.target.new_surface_with_dimensions(dim).unwrap();
- self.drop_shadows = self.target.new_surface_with_dimensions(dim).unwrap();
- self.shape_fills = self.target.new_surface_with_dimensions(dim).unwrap();
self.debug = self.target.new_surface_with_dimensions(dim).unwrap();
+ // The rest are tile size surfaces
}
pub fn draw_rect_to(&mut self, id: SurfaceId, shape: &Shape, paint: &Paint) {
@@ -137,4 +189,138 @@ impl Surfaces {
self.canvas(id).draw_path(&path, paint);
}
}
+
+ pub fn reset(&mut self, color: skia::Color) {
+ self.canvas(SurfaceId::Fills).restore_to_count(1);
+ self.canvas(SurfaceId::DropShadows).restore_to_count(1);
+ self.canvas(SurfaceId::InnerShadows).restore_to_count(1);
+ self.canvas(SurfaceId::Strokes).restore_to_count(1);
+ self.canvas(SurfaceId::Current).restore_to_count(1);
+ self.apply_mut(
+ &[
+ SurfaceId::Fills,
+ SurfaceId::Strokes,
+ SurfaceId::Current,
+ SurfaceId::DropShadows,
+ SurfaceId::InnerShadows,
+ ],
+ |s| {
+ s.canvas().clear(color).reset_matrix();
+ },
+ );
+
+ self.canvas(SurfaceId::Debug)
+ .clear(skia::Color::TRANSPARENT)
+ .reset_matrix();
+ }
+
+ pub fn cache_clear_visited(&mut self) {
+ self.tiles.clear_visited();
+ }
+
+ pub fn cache_visit(&mut self, tile: Tile) {
+ self.tiles.visit(tile);
+ }
+
+ pub fn cache_current_tile_texture(&mut self, tile: Tile) {
+ let snapshot = self.current.image_snapshot();
+ let rect = IRect::from_xywh(
+ self.margins.width,
+ self.margins.height,
+ snapshot.width() - TILE_SIZE_MULTIPLIER * self.margins.width,
+ snapshot.height() - TILE_SIZE_MULTIPLIER * self.margins.height,
+ );
+
+ let mut context = self.current.direct_context();
+ if let Some(snapshot) = snapshot.make_subset(&mut context, &rect) {
+ self.tiles.add(tile, snapshot);
+ }
+ }
+
+ pub fn has_cached_tile_surface(&mut self, tile: Tile) -> bool {
+ self.tiles.has(tile)
+ }
+
+ pub fn remove_cached_tile_surface(&mut self, tile: Tile) -> bool {
+ self.tiles.remove(tile)
+ }
+
+ pub fn draw_cached_tile_surface(&mut self, tile: Tile, rect: skia::Rect) {
+ let image = self.tiles.get(tile).unwrap();
+ self.target
+ .canvas()
+ .draw_image_rect(&image, None, rect, &skia::Paint::default());
+ }
+
+ pub fn remove_cached_tiles(&mut self) {
+ self.tiles.clear();
+ }
+}
+
+pub struct TileTextureCache {
+ grid: HashMap,
+ visited: HashMap,
+}
+
+impl TileTextureCache {
+ pub fn new() -> Self {
+ Self {
+ grid: HashMap::new(),
+ visited: HashMap::new(),
+ }
+ }
+
+ pub fn has(&mut self, tile: Tile) -> bool {
+ return self.grid.contains_key(&tile);
+ }
+
+ fn remove_list(&mut self, marked: Vec) {
+ for tile in marked.iter() {
+ self.grid.remove(tile);
+ }
+ }
+
+ pub fn add(&mut self, tile: Tile, image: skia::Image) {
+ if self.grid.len() > TEXTURES_CACHE_CAPACITY {
+ let marked: Vec<_> = self
+ .grid
+ .iter_mut()
+ .filter_map(|(tile, _)| {
+ if !self.visited.contains_key(tile) {
+ Some(tile.clone())
+ } else {
+ None
+ }
+ })
+ .take(TEXTURES_BATCH_DELETE)
+ .collect();
+ self.remove_list(marked);
+ }
+ self.grid.insert(tile, image);
+ }
+
+ pub fn get(&mut self, tile: Tile) -> Result<&mut skia::Image, String> {
+ let image = self.grid.get_mut(&tile).unwrap();
+ Ok(image)
+ }
+
+ pub fn remove(&mut self, tile: Tile) -> bool {
+ if !self.grid.contains_key(&tile) {
+ return false;
+ }
+ self.grid.remove(&tile);
+ true
+ }
+
+ pub fn clear(&mut self) {
+ self.grid.clear();
+ }
+
+ pub fn clear_visited(&mut self) {
+ self.visited.clear();
+ }
+
+ pub fn visit(&mut self, tile: Tile) {
+ self.visited.insert(tile, true);
+ }
}
diff --git a/render-wasm/src/render/text.rs b/render-wasm/src/render/text.rs
index c494dcb9dc..9ef6cdb1d2 100644
--- a/render-wasm/src/render/text.rs
+++ b/render-wasm/src/render/text.rs
@@ -1,13 +1,25 @@
-use super::{RenderState, SurfaceId};
-use crate::shapes::TextContent;
+use super::{RenderState, Shape, SurfaceId};
+use skia_safe::{self as skia, canvas::SaveLayerRec, paint, textlayout::Paragraph};
-pub fn render(render_state: &mut RenderState, text: &TextContent) {
+pub fn render(
+ render_state: &mut RenderState,
+ shape: &Shape,
+ paragraphs: &[Paragraph],
+ surface_id: Option,
+ paint: Option<&paint::Paint>,
+) {
let mut offset_y = 0.0;
- for mut skia_paragraph in text.to_paragraphs(&render_state.fonts().font_collection()) {
- skia_paragraph.layout(text.width());
+ let default_paint = skia::Paint::default();
+ let mask = SaveLayerRec::default().paint(&paint.unwrap_or(&default_paint));
+ let canvas = render_state
+ .surfaces
+ .canvas(surface_id.unwrap_or(SurfaceId::Fills));
- let xy = (text.x(), text.y() + offset_y);
- skia_paragraph.paint(render_state.surfaces.canvas(SurfaceId::Fills), xy);
+ canvas.save_layer(&mask);
+ for skia_paragraph in paragraphs {
+ let xy = (shape.selrect().x(), shape.selrect.y() + offset_y);
+ skia_paragraph.paint(canvas, xy);
offset_y += skia_paragraph.height();
}
+ canvas.restore();
}
diff --git a/render-wasm/src/render/tiles.rs b/render-wasm/src/render/tiles.rs
new file mode 100644
index 0000000000..d14e5fed91
--- /dev/null
+++ b/render-wasm/src/render/tiles.rs
@@ -0,0 +1,114 @@
+use crate::uuid::Uuid;
+use crate::view::Viewbox;
+use indexmap::IndexSet;
+use skia_safe as skia;
+use std::collections::{HashMap, HashSet};
+
+pub type Tile = (i32, i32);
+pub type TileWithDistance = (i32, i32, i32);
+
+pub const TILE_SIZE: f32 = 512.;
+
+// @see https://en.wikipedia.org/wiki/Taxicab_geometry
+pub fn manhattan_distance(a: (i32, i32), b: (i32, i32)) -> i32 {
+ (a.0 - b.0).abs() + (a.1 - b.1).abs()
+}
+
+pub fn get_tile_dimensions() -> skia::ISize {
+ (TILE_SIZE as i32, TILE_SIZE as i32).into()
+}
+
+pub fn get_tiles_for_rect(rect: skia::Rect, tile_size: f32) -> (i32, i32, i32, i32) {
+ // start
+ let sx = (rect.left / tile_size).floor() as i32;
+ let sy = (rect.top / tile_size).floor() as i32;
+ // end
+ let ex = (rect.right / tile_size).floor() as i32;
+ let ey = (rect.bottom / tile_size).floor() as i32;
+ (sx, sy, ex, ey)
+}
+
+pub fn get_tiles_for_viewbox(viewbox: Viewbox) -> (i32, i32, i32, i32) {
+ let tile_size = get_tile_size(viewbox);
+ get_tiles_for_rect(viewbox.area, tile_size)
+}
+
+pub fn get_tiles_for_viewbox_with_interest(
+ viewbox: Viewbox,
+ interest: i32,
+) -> (i32, i32, i32, i32) {
+ let (sx, sy, ex, ey) = get_tiles_for_viewbox(viewbox);
+ (sx - interest, sy - interest, ex + interest, ey + interest)
+}
+
+pub fn get_tile_pos(viewbox: Viewbox, (x, y): Tile) -> (f32, f32) {
+ (
+ x as f32 * get_tile_size(viewbox),
+ y as f32 * get_tile_size(viewbox),
+ )
+}
+
+pub fn get_tile_size(viewbox: Viewbox) -> f32 {
+ // TODO: * self.options.dpr() too?
+ 1. / viewbox.zoom * TILE_SIZE
+}
+
+pub fn get_tile_rect(viewbox: Viewbox, tile: Tile) -> skia::Rect {
+ let (tx, ty) = get_tile_pos(viewbox, tile);
+ let ts = get_tile_size(viewbox);
+ skia::Rect::from_xywh(tx, ty, ts, ts)
+}
+
+// This structure is usseful to keep all the shape uuids by shape id.
+pub struct TileHashMap {
+ grid: HashMap>,
+ index: HashMap>,
+}
+
+impl TileHashMap {
+ pub fn new() -> Self {
+ TileHashMap {
+ grid: HashMap::new(),
+ index: HashMap::new(),
+ }
+ }
+
+ pub fn get_shapes_at(&mut self, tile: Tile) -> Option<&IndexSet> {
+ return self.grid.get(&tile);
+ }
+
+ pub fn remove_shape_at(&mut self, tile: Tile, id: Uuid) {
+ if let Some(shapes) = self.grid.get_mut(&tile) {
+ shapes.shift_remove(&id);
+ }
+
+ if let Some(tiles) = self.index.get_mut(&id) {
+ tiles.remove(&tile);
+ }
+ }
+
+ pub fn get_tiles_of(&mut self, shape_id: Uuid) -> Option<&HashSet> {
+ self.index.get(&shape_id)
+ }
+
+ pub fn add_shape_at(&mut self, tile: Tile, shape_id: Uuid) {
+ if !self.grid.contains_key(&tile) {
+ self.grid.insert(tile, IndexSet::new());
+ }
+
+ if !self.index.contains_key(&shape_id) {
+ self.index.insert(shape_id, HashSet::new());
+ }
+
+ let tile_set = self.grid.get_mut(&tile).unwrap();
+ tile_set.insert(shape_id);
+
+ let index_set = self.index.get_mut(&shape_id).unwrap();
+ index_set.insert(tile);
+ }
+
+ pub fn invalidate(&mut self) {
+ self.grid.clear();
+ self.index.clear();
+ }
+}
diff --git a/render-wasm/src/shapes.rs b/render-wasm/src/shapes.rs
index ec58b4f0e7..caf9056c82 100644
--- a/render-wasm/src/shapes.rs
+++ b/render-wasm/src/shapes.rs
@@ -1,9 +1,8 @@
use skia_safe::{self as skia};
-use std::collections::HashMap;
-use uuid::Uuid;
-
use crate::render::BlendMode;
+use crate::uuid::Uuid;
+use std::collections::{HashMap, HashSet};
mod blurs;
mod bools;
@@ -41,6 +40,10 @@ pub use transform::*;
use crate::math;
use crate::math::{Bounds, Matrix, Point};
+use indexmap::IndexSet;
+
+const MIN_VISIBLE_SIZE: f32 = 2.0;
+const ANTIALIAS_THRESHOLD: f32 = 15.0;
#[derive(Debug, Clone, PartialEq)]
pub enum Type {
@@ -157,7 +160,7 @@ pub struct Shape {
pub id: Uuid,
pub parent_id: Option,
pub shape_type: Type,
- pub children: Vec,
+ pub children: IndexSet,
pub selrect: math::Rect,
pub transform: Matrix,
pub rotation: f32,
@@ -182,7 +185,7 @@ impl Shape {
id,
parent_id: None,
shape_type: Type::Rect(Rect::default()),
- children: Vec::::new(),
+ children: IndexSet::::new(),
selrect: math::Rect::new_empty(),
transform: Matrix::default(),
rotation: 0.,
@@ -318,7 +321,7 @@ impl Shape {
pub fn set_flex_layout_data(
&mut self,
- direction: Direction,
+ direction: FlexDirection,
row_gap: f32,
column_gap: f32,
align_items: AlignItems,
@@ -334,7 +337,6 @@ impl Shape {
match &mut self.shape_type {
Type::Frame(data) => {
let layout_data = LayoutData {
- direction,
align_items,
align_content,
justify_items,
@@ -343,11 +345,12 @@ impl Shape {
padding_right,
padding_bottom,
padding_left,
+ row_gap,
+ column_gap,
};
let flex_data = FlexData {
- row_gap,
- column_gap,
+ direction,
wrap_type,
};
@@ -357,16 +360,88 @@ impl Shape {
}
}
+ pub fn set_grid_layout_data(
+ &mut self,
+ direction: GridDirection,
+ row_gap: f32,
+ column_gap: f32,
+ align_items: AlignItems,
+ align_content: AlignContent,
+ justify_items: JustifyItems,
+ justify_content: JustifyContent,
+ padding_top: f32,
+ padding_right: f32,
+ padding_bottom: f32,
+ padding_left: f32,
+ ) {
+ match &mut self.shape_type {
+ Type::Frame(data) => {
+ let layout_data = LayoutData {
+ align_items,
+ align_content,
+ justify_items,
+ justify_content,
+ padding_top,
+ padding_right,
+ padding_bottom,
+ padding_left,
+ row_gap,
+ column_gap,
+ };
+
+ let mut grid_data = GridData::default();
+ grid_data.direction = direction;
+ data.layout = Some(Layout::GridLayout(layout_data, grid_data));
+ }
+ _ => {}
+ }
+ }
+
+ pub fn set_grid_columns(&mut self, tracks: Vec) {
+ let Type::Frame(frame_data) = &mut self.shape_type else {
+ return;
+ };
+ let Some(Layout::GridLayout(_, grid_data)) = &mut frame_data.layout else {
+ return;
+ };
+ grid_data.columns = tracks.iter().map(GridTrack::from_raw).collect();
+ }
+
+ pub fn set_grid_rows(&mut self, tracks: Vec) {
+ let Type::Frame(frame_data) = &mut self.shape_type else {
+ return;
+ };
+ let Some(Layout::GridLayout(_, grid_data)) = &mut frame_data.layout else {
+ return;
+ };
+ grid_data.rows = tracks.iter().map(GridTrack::from_raw).collect();
+ }
+
+ pub fn set_grid_cells(&mut self, cells: Vec) {
+ let Type::Frame(frame_data) = &mut self.shape_type else {
+ return;
+ };
+ let Some(Layout::GridLayout(_, grid_data)) = &mut frame_data.layout else {
+ return;
+ };
+ grid_data.cells = cells.iter().map(GridCell::from_raw).collect();
+ }
+
pub fn set_blur(&mut self, blur_type: u8, hidden: bool, value: f32) {
self.blur = Blur::new(blur_type, hidden, value);
}
pub fn add_child(&mut self, id: Uuid) {
- self.children.push(id);
+ self.children.insert(id);
}
- pub fn clear_children(&mut self) {
- self.children.clear();
+ pub fn compute_children_differences(
+ &mut self,
+ children: &IndexSet,
+ ) -> (IndexSet, IndexSet) {
+ let added = children.difference(&self.children).cloned().collect();
+ let removed = self.children.difference(children).cloned().collect();
+ (added, removed)
}
pub fn fills(&self) -> std::slice::Iter {
@@ -381,21 +456,6 @@ impl Shape {
self.fills.clear();
}
- pub fn add_fill_gradient_stops(&mut self, buffer: Vec) -> Result<(), String> {
- let fill = self.fills.last_mut().ok_or("Shape has no fills")?;
- let gradient = match fill {
- Fill::LinearGradient(g) => Ok(g),
- Fill::RadialGradient(g) => Ok(g),
- _ => Err("Active fill is not a gradient"),
- }?;
-
- for stop in buffer.into_iter() {
- gradient.add_stop(stop.color(), stop.offset());
- }
-
- Ok(())
- }
-
pub fn strokes(&self) -> std::slice::Iter {
self.strokes.iter()
}
@@ -410,22 +470,6 @@ impl Shape {
Ok(())
}
- pub fn add_stroke_gradient_stops(&mut self, buffer: Vec) -> Result<(), String> {
- let stroke = self.strokes.last_mut().ok_or("Shape has no strokes")?;
- let fill = &mut stroke.fill;
- let gradient = match fill {
- Fill::LinearGradient(g) => Ok(g),
- Fill::RadialGradient(g) => Ok(g),
- _ => Err("Active stroke is not a gradient"),
- }?;
-
- for stop in buffer.into_iter() {
- gradient.add_stop(stop.color(), stop.offset());
- }
-
- Ok(())
- }
-
pub fn clear_strokes(&mut self) {
self.strokes.clear();
}
@@ -505,6 +549,21 @@ impl Shape {
self.hidden
}
+ #[allow(dead_code)]
+ pub fn width(&self) -> f32 {
+ self.selrect.width()
+ }
+
+ pub fn visually_insignificant(&self, scale: f32) -> bool {
+ self.selrect.width() * scale < MIN_VISIBLE_SIZE
+ || self.selrect.height() * scale < MIN_VISIBLE_SIZE
+ }
+
+ pub fn should_use_antialias(&self, scale: f32) -> bool {
+ self.selrect.width() * scale > ANTIALIAS_THRESHOLD
+ || self.selrect.height() * scale > ANTIALIAS_THRESHOLD
+ }
+
// TODO: Maybe store this inside the shape
pub fn bounds(&self) -> Bounds {
let mut bounds = Bounds::new(
@@ -531,6 +590,33 @@ impl Shape {
self.selrect
}
+ pub fn extrect(&self) -> math::Rect {
+ let mut rect = self.bounds().to_rect();
+ for shadow in self.shadows.iter() {
+ let (x, y) = shadow.offset;
+ let mut shadow_rect = rect.clone();
+ shadow_rect.left += x;
+ shadow_rect.right += x;
+ shadow_rect.top += y;
+ shadow_rect.bottom += y;
+
+ shadow_rect.left -= shadow.blur;
+ shadow_rect.top -= shadow.blur;
+ shadow_rect.right += shadow.blur;
+ shadow_rect.bottom += shadow.blur;
+
+ rect.join(shadow_rect);
+ }
+ if self.blur.blur_type != blurs::BlurType::None {
+ rect.left -= self.blur.value;
+ rect.top -= self.blur.value;
+ rect.right += self.blur.value;
+ rect.bottom += self.blur.value;
+ }
+
+ rect
+ }
+
pub fn center(&self) -> Point {
self.selrect.center()
}
@@ -543,17 +629,17 @@ impl Shape {
self.children.first()
}
- pub fn children_ids(&self) -> Vec {
+ pub fn children_ids(&self) -> IndexSet {
if let Type::Bool(_) = self.shape_type {
- vec![]
+ IndexSet::::new()
} else if let Type::Group(group) = self.shape_type {
if group.masked {
- self.children[1..self.children.len()].to_vec()
+ self.children.iter().skip(1).cloned().collect()
} else {
- self.children.clone()
+ self.children.clone().into_iter().collect()
}
} else {
- self.children.clone()
+ self.children.clone().into_iter().collect()
}
}
@@ -574,7 +660,10 @@ impl Shape {
}
pub fn is_recursive(&self) -> bool {
- !matches!(self.shape_type, Type::SVGRaw(_))
+ matches!(
+ self.shape_type,
+ Type::Frame(_) | Type::Group(_) | Type::Bool(_)
+ )
}
pub fn add_shadow(&mut self, shadow: Shadow) {
@@ -611,25 +700,10 @@ impl Shape {
}
}
- pub fn add_text_leaf(
- &mut self,
- text_str: String,
- font_family: FontFamily,
- font_size: f32,
- ) -> Result<(), String> {
+ pub fn add_paragraph(&mut self, paragraph: Paragraph) -> Result<(), String> {
match self.shape_type {
Type::Text(ref mut text) => {
- text.add_leaf(text_str, font_family, font_size)?;
- Ok(())
- }
- _ => Err("Shape is not a text".to_string()),
- }
- }
-
- pub fn add_text_paragraph(&mut self) -> Result<(), String> {
- match self.shape_type {
- Type::Text(ref mut text) => {
- text.add_paragraph();
+ text.add_paragraph(paragraph);
Ok(())
}
_ => Err("Shape is not a text".to_string()),
@@ -671,12 +745,13 @@ impl Shape {
let width = bounds.width();
let height = bounds.height();
- self.selrect = math::Rect::from_xywh(
+ let new_selrect = math::Rect::from_xywh(
center.x - width / 2.0,
center.y - height / 2.0,
width,
height,
);
+ self.selrect = new_selrect;
}
pub fn apply_transform(&mut self, transform: &Matrix) {
@@ -691,6 +766,20 @@ impl Shape {
}
}
+ pub fn is_absolute(&self) -> bool {
+ match &self.layout_item {
+ Some(LayoutItem { is_absolute, .. }) => *is_absolute,
+ _ => false,
+ }
+ }
+
+ pub fn z_index(&self) -> i32 {
+ match &self.layout_item {
+ Some(LayoutItem { z_index, .. }) => *z_index,
+ _ => 0,
+ }
+ }
+
pub fn is_layout_vertical_auto(&self) -> bool {
match &self.layout_item {
Some(LayoutItem { v_sizing, .. }) => v_sizing == &Sizing::Auto,
@@ -718,6 +807,44 @@ impl Shape {
_ => false,
}
}
+
+ pub fn has_fills(&self) -> bool {
+ !self.fills.is_empty()
+ }
+}
+
+/*
+ Returns the list of children taking into account the structure modifiers
+*/
+pub fn modified_children_ids(
+ element: &Shape,
+ structure: Option<&Vec>,
+) -> IndexSet {
+ if let Some(structure) = structure {
+ let mut result: Vec = Vec::from_iter(element.children_ids().iter().map(|id| *id));
+ let mut to_remove = HashSet::<&Uuid>::new();
+
+ for st in structure {
+ match st.entry_type {
+ StructureEntryType::AddChild => {
+ result.insert(st.index as usize, st.id);
+ }
+ StructureEntryType::RemoveChild => {
+ to_remove.insert(&st.id);
+ }
+ }
+ }
+
+ let ret: IndexSet = result
+ .iter()
+ .filter(|id| !to_remove.contains(id))
+ .map(|id| *id)
+ .collect();
+
+ ret
+ } else {
+ element.children_ids()
+ }
}
#[cfg(test)]
diff --git a/render-wasm/src/shapes/fills.rs b/render-wasm/src/shapes/fills.rs
index d94c21fc00..f85ba75068 100644
--- a/render-wasm/src/shapes/fills.rs
+++ b/render-wasm/src/shapes/fills.rs
@@ -1,32 +1,107 @@
use skia_safe::{self as skia, Rect};
use super::Color;
-use uuid::Uuid;
+use crate::uuid::Uuid;
+
+const MAX_GRADIENT_STOPS: usize = 16;
+const BASE_GRADIENT_DATA_SIZE: usize = 28;
+const RAW_GRADIENT_DATA_SIZE: usize =
+ BASE_GRADIENT_DATA_SIZE + RAW_STOP_DATA_SIZE * MAX_GRADIENT_STOPS;
+
+#[derive(Debug)]
+#[repr(C)]
+pub struct RawGradientData {
+ start_x: f32,
+ start_y: f32,
+ end_x: f32,
+ end_y: f32,
+ opacity: f32,
+ width: f32,
+ stop_count: u32,
+ stops: [RawStopData; MAX_GRADIENT_STOPS],
+}
+
+impl From<[u8; RAW_GRADIENT_DATA_SIZE]> for RawGradientData {
+ fn from(bytes: [u8; RAW_GRADIENT_DATA_SIZE]) -> Self {
+ Self {
+ start_x: f32::from_le_bytes([bytes[0], bytes[1], bytes[2], bytes[3]]),
+ start_y: f32::from_le_bytes([bytes[4], bytes[5], bytes[6], bytes[7]]),
+ end_x: f32::from_le_bytes([bytes[8], bytes[9], bytes[10], bytes[11]]),
+ end_y: f32::from_le_bytes([bytes[12], bytes[13], bytes[14], bytes[15]]),
+ opacity: f32::from_le_bytes([bytes[16], bytes[17], bytes[18], bytes[19]]),
+ width: f32::from_le_bytes([bytes[20], bytes[21], bytes[22], bytes[23]]),
+ stop_count: u32::from_le_bytes([bytes[24], bytes[25], bytes[26], bytes[27]]),
+ // FIXME: 2025-04-22: use `array_chunks` once the next release is out
+ // and we update our devenv.
+ // See https://github.com/rust-lang/rust/issues/74985
+ stops: bytes[28..]
+ .chunks_exact(RAW_STOP_DATA_SIZE)
+ .map(|chunk| RawStopData::try_from(chunk).unwrap())
+ .collect::>()
+ .try_into()
+ .unwrap(),
+ }
+ }
+}
+
+impl RawGradientData {
+ pub fn start(&self) -> (f32, f32) {
+ (self.start_x, self.start_y)
+ }
+
+ pub fn end(&self) -> (f32, f32) {
+ (self.end_x, self.end_y)
+ }
+
+ pub fn opacity(&self) -> f32 {
+ self.opacity
+ }
+
+ pub fn width(&self) -> f32 {
+ self.width
+ }
+}
+
+pub const RAW_STOP_DATA_SIZE: usize = 8;
#[derive(Debug)]
#[repr(C)]
pub struct RawStopData {
- color: [u8; 4],
- offset: u8,
+ color: u32,
+ offset: f32,
}
impl RawStopData {
pub fn color(&self) -> skia::Color {
- skia::Color::from_argb(self.color[3], self.color[0], self.color[1], self.color[2])
+ skia::Color::from(self.color)
}
pub fn offset(&self) -> f32 {
- self.offset as f32 / 100.0
+ self.offset
}
+}
- pub fn from_bytes(bytes: [u8; 5]) -> Self {
+impl From<[u8; RAW_STOP_DATA_SIZE]> for RawStopData {
+ fn from(bytes: [u8; RAW_STOP_DATA_SIZE]) -> Self {
Self {
- color: [bytes[0], bytes[1], bytes[2], bytes[3]],
- offset: bytes[4],
+ color: u32::from_le_bytes([bytes[0], bytes[1], bytes[2], bytes[3]]),
+ offset: f32::from_le_bytes([bytes[4], bytes[5], bytes[6], bytes[7]]),
}
}
}
+// FIXME: We won't need this once we use `array_chunks`. See comment above.
+impl TryFrom<&[u8]> for RawStopData {
+ type Error = String;
+
+ fn try_from(bytes: &[u8]) -> Result {
+ let data: [u8; RAW_STOP_DATA_SIZE] = bytes
+ .try_into()
+ .map_err(|_| "Invalid stop data".to_string())?;
+ Ok(RawStopData::from(data))
+ }
+}
+
#[derive(Debug, Clone, PartialEq)]
pub struct Gradient {
colors: Vec,
@@ -38,9 +113,11 @@ pub struct Gradient {
}
impl Gradient {
- pub fn add_stop(&mut self, color: Color, offset: f32) {
- self.colors.push(color);
- self.offsets.push(offset);
+ fn add_stops(&mut self, stops: &[(Color, f32)]) {
+ let colors = stops.iter().map(|(color, _)| *color);
+ let offsets = stops.iter().map(|(_, offset)| *offset);
+ self.colors.extend(colors);
+ self.offsets.extend(offsets);
}
fn to_linear_shader(&self, rect: &Rect) -> Option {
@@ -96,6 +173,43 @@ impl Gradient {
}
}
+impl From for Gradient {
+ fn from(raw_gradient: RawGradientData) -> Self {
+ let stops = raw_gradient
+ .stops
+ .iter()
+ .take(raw_gradient.stop_count as usize)
+ .map(|stop| (stop.color(), stop.offset()))
+ .collect::>();
+
+ let mut gradient = Gradient {
+ start: raw_gradient.start(),
+ end: raw_gradient.end(),
+ opacity: raw_gradient.opacity(),
+ colors: vec![],
+ offsets: vec![],
+ width: raw_gradient.width(),
+ };
+
+ gradient.add_stops(&stops);
+
+ gradient
+ }
+}
+
+impl TryFrom<&[u8]> for Gradient {
+ type Error = String;
+
+ fn try_from(bytes: &[u8]) -> Result {
+ let raw_gradient_bytes: [u8; RAW_GRADIENT_DATA_SIZE] = bytes[0..RAW_GRADIENT_DATA_SIZE]
+ .try_into()
+ .map_err(|_| "Invalid gradient data".to_string())?;
+ let gradient = RawGradientData::from(raw_gradient_bytes).into();
+
+ Ok(gradient)
+ }
+}
+
#[derive(Debug, Clone, PartialEq)]
pub struct ImageFill {
id: Uuid,
@@ -123,32 +237,6 @@ pub enum Fill {
}
impl Fill {
- pub fn new_linear_gradient(start: (f32, f32), end: (f32, f32), opacity: f32) -> Self {
- Self::LinearGradient(Gradient {
- start,
- end,
- opacity,
- colors: vec![],
- offsets: vec![],
- width: 0.,
- })
- }
- pub fn new_radial_gradient(
- start: (f32, f32),
- end: (f32, f32),
- opacity: f32,
- width: f32,
- ) -> Self {
- Self::RadialGradient(Gradient {
- start,
- end,
- opacity,
- colors: vec![],
- offsets: vec![],
- width,
- })
- }
-
pub fn new_image_fill(id: Uuid, opacity: u8, (width, height): (i32, i32)) -> Self {
Self::Image(ImageFill {
id,
@@ -158,38 +246,38 @@ impl Fill {
})
}
- pub fn to_paint(&self, rect: &Rect) -> skia::Paint {
+ pub fn to_paint(&self, rect: &Rect, anti_alias: bool) -> skia::Paint {
match self {
Self::Solid(color) => {
let mut p = skia::Paint::default();
p.set_color(*color);
p.set_style(skia::PaintStyle::Fill);
- p.set_anti_alias(true);
+ p.set_anti_alias(anti_alias);
p.set_blend_mode(skia::BlendMode::SrcOver);
p
}
Self::LinearGradient(gradient) => {
let mut p = skia::Paint::default();
- p.set_shader(gradient.to_linear_shader(&rect));
+ p.set_shader(gradient.to_linear_shader(rect));
p.set_alpha((gradient.opacity * 255.) as u8);
p.set_style(skia::PaintStyle::Fill);
- p.set_anti_alias(true);
+ p.set_anti_alias(anti_alias);
p.set_blend_mode(skia::BlendMode::SrcOver);
p
}
Self::RadialGradient(gradient) => {
let mut p = skia::Paint::default();
- p.set_shader(gradient.to_radial_shader(&rect));
+ p.set_shader(gradient.to_radial_shader(rect));
p.set_alpha((gradient.opacity * 255.) as u8);
p.set_style(skia::PaintStyle::Fill);
- p.set_anti_alias(true);
+ p.set_anti_alias(anti_alias);
p.set_blend_mode(skia::BlendMode::SrcOver);
p
}
Self::Image(image_fill) => {
let mut p = skia::Paint::default();
p.set_style(skia::PaintStyle::Fill);
- p.set_anti_alias(true);
+ p.set_anti_alias(anti_alias);
p.set_blend_mode(skia::BlendMode::SrcOver);
p.set_alpha(image_fill.opacity);
p
diff --git a/render-wasm/src/shapes/fonts.rs b/render-wasm/src/shapes/fonts.rs
index 58104af062..7a4524cad5 100644
--- a/render-wasm/src/shapes/fonts.rs
+++ b/render-wasm/src/shapes/fonts.rs
@@ -1,6 +1,6 @@
use std::fmt;
-use uuid::Uuid;
+use crate::uuid::Uuid;
#[derive(Debug, PartialEq, Clone, Copy)]
pub enum FontStyle {
@@ -39,6 +39,10 @@ impl FontFamily {
pub fn new(id: Uuid, weight: u32, style: FontStyle) -> Self {
Self { id, style, weight }
}
+
+ pub fn alias(&self) -> String {
+ format!("{}", self)
+ }
}
impl fmt::Display for FontFamily {
diff --git a/render-wasm/src/shapes/layouts.rs b/render-wasm/src/shapes/layouts.rs
index 3dcdf2e166..b6fea8b85d 100644
--- a/render-wasm/src/shapes/layouts.rs
+++ b/render-wasm/src/shapes/layouts.rs
@@ -1,3 +1,6 @@
+use crate::utils::uuid_from_u32_quartet;
+use crate::uuid::Uuid;
+
#[derive(Debug, Clone, PartialEq)]
#[allow(dead_code)]
pub enum Layout {
@@ -6,14 +9,14 @@ pub enum Layout {
}
#[derive(Debug, Clone, PartialEq)]
-pub enum Direction {
+pub enum FlexDirection {
Row,
RowReverse,
Column,
ColumnReverse,
}
-impl Direction {
+impl FlexDirection {
pub fn from_u8(value: u8) -> Self {
match value {
0 => Self::Row,
@@ -26,6 +29,22 @@ impl Direction {
}
#[derive(Debug, Clone, PartialEq)]
+pub enum GridDirection {
+ Row,
+ Column,
+}
+
+impl GridDirection {
+ pub fn from_u8(value: u8) -> Self {
+ match value {
+ 0 => Self::Row,
+ 1 => Self::Column,
+ _ => unreachable!(),
+ }
+ }
+}
+
+#[derive(Debug, Clone, PartialEq, Copy)]
pub enum AlignItems {
Start,
End,
@@ -45,7 +64,7 @@ impl AlignItems {
}
}
-#[derive(Debug, Clone, PartialEq)]
+#[derive(Debug, Clone, PartialEq, Copy)]
pub enum AlignContent {
Start,
End,
@@ -71,7 +90,7 @@ impl AlignContent {
}
}
-#[derive(Debug, Clone, PartialEq)]
+#[derive(Debug, Clone, PartialEq, Copy)]
pub enum JustifyItems {
Start,
End,
@@ -91,7 +110,7 @@ impl JustifyItems {
}
}
-#[derive(Debug, Clone, PartialEq)]
+#[derive(Debug, Clone, PartialEq, Copy)]
pub enum JustifyContent {
Start,
End,
@@ -132,9 +151,82 @@ impl WrapType {
}
}
}
+#[derive(Debug, Copy, Clone, PartialEq)]
+pub enum GridTrackType {
+ Percent,
+ Flex,
+ Auto,
+ Fixed,
+}
+
+impl GridTrackType {
+ pub fn from_u8(value: u8) -> Self {
+ match value {
+ 0 => Self::Percent,
+ 1 => Self::Flex,
+ 2 => Self::Auto,
+ 3 => Self::Fixed,
+ _ => unreachable!(),
+ }
+ }
+}
#[derive(Debug, Clone, PartialEq)]
-pub struct GridTrack {}
+pub struct GridTrack {
+ pub track_type: GridTrackType,
+ pub value: f32,
+}
+
+impl GridTrack {
+ pub fn from_raw(raw: &RawGridTrack) -> Self {
+ Self {
+ track_type: GridTrackType::from_u8(raw.track_type),
+ value: f32::from_le_bytes(raw.value),
+ }
+ }
+}
+
+#[derive(Debug, Clone, PartialEq)]
+pub struct GridCell {
+ pub row: i32,
+ pub row_span: i32,
+ pub column: i32,
+ pub column_span: i32,
+ pub align_self: Option,
+ pub justify_self: Option,
+ pub shape: Option,
+}
+
+impl GridCell {
+ pub fn from_raw(raw: &RawGridCell) -> Self {
+ Self {
+ row: i32::from_le_bytes(raw.row),
+ row_span: i32::from_le_bytes(raw.row_span),
+ column: i32::from_le_bytes(raw.column),
+ column_span: i32::from_le_bytes(raw.column_span),
+ align_self: if raw.has_align_self == 1 {
+ AlignSelf::from_u8(raw.align_self)
+ } else {
+ None
+ },
+ justify_self: if raw.has_justify_self == 1 {
+ JustifySelf::from_u8(raw.justify_self)
+ } else {
+ None
+ },
+ shape: if raw.has_shape_id == 1 {
+ Some(uuid_from_u32_quartet(
+ u32::from_le_bytes(raw.shape_id_a),
+ u32::from_le_bytes(raw.shape_id_b),
+ u32::from_le_bytes(raw.shape_id_c),
+ u32::from_le_bytes(raw.shape_id_d),
+ ))
+ } else {
+ None
+ },
+ }
+ }
+}
#[derive(Debug, Clone, PartialEq, Copy)]
pub enum Sizing {
@@ -156,7 +248,6 @@ impl Sizing {
#[derive(Debug, Clone, PartialEq)]
pub struct LayoutData {
- pub direction: Direction,
pub align_items: AlignItems,
pub align_content: AlignContent,
pub justify_items: JustifyItems,
@@ -165,33 +256,13 @@ pub struct LayoutData {
pub padding_right: f32,
pub padding_bottom: f32,
pub padding_left: f32,
-}
-
-impl LayoutData {
- pub fn is_reverse(&self) -> bool {
- match &self.direction {
- Direction::RowReverse | Direction::ColumnReverse => true,
- _ => false,
- }
- }
- pub fn is_row(&self) -> bool {
- match &self.direction {
- Direction::RowReverse | Direction::Row => true,
- _ => false,
- }
- }
-
- #[allow(dead_code)]
- pub fn is_column(&self) -> bool {
- match &self.direction {
- Direction::ColumnReverse | Direction::Column => true,
- _ => false,
- }
- }
+ pub row_gap: f32,
+ pub column_gap: f32,
}
#[derive(Debug, Copy, Clone, PartialEq)]
pub enum AlignSelf {
+ Auto,
Start,
End,
Center,
@@ -201,10 +272,33 @@ pub enum AlignSelf {
impl AlignSelf {
pub fn from_u8(value: u8) -> Option {
match value {
- 0 => Some(Self::Start),
- 1 => Some(Self::End),
- 2 => Some(Self::Center),
- 3 => Some(Self::Stretch),
+ 0 => Some(Self::Auto),
+ 1 => Some(Self::Start),
+ 2 => Some(Self::End),
+ 3 => Some(Self::Center),
+ 4 => Some(Self::Stretch),
+ _ => None,
+ }
+ }
+}
+
+#[derive(Debug, Copy, Clone, PartialEq)]
+pub enum JustifySelf {
+ Auto,
+ Start,
+ End,
+ Center,
+ Stretch,
+}
+
+impl JustifySelf {
+ pub fn from_u8(value: u8) -> Option {
+ match value {
+ 0 => Some(Self::Auto),
+ 1 => Some(Self::Start),
+ 2 => Some(Self::End),
+ 3 => Some(Self::Center),
+ 4 => Some(Self::Stretch),
_ => None,
}
}
@@ -212,11 +306,26 @@ impl AlignSelf {
#[derive(Debug, Clone, PartialEq)]
pub struct FlexData {
- pub row_gap: f32,
- pub column_gap: f32,
+ pub direction: FlexDirection,
pub wrap_type: WrapType,
}
+impl FlexData {
+ pub fn is_reverse(&self) -> bool {
+ match &self.direction {
+ FlexDirection::RowReverse | FlexDirection::ColumnReverse => true,
+ _ => false,
+ }
+ }
+
+ pub fn is_row(&self) -> bool {
+ match &self.direction {
+ FlexDirection::RowReverse | FlexDirection::Row => true,
+ _ => false,
+ }
+ }
+}
+
impl FlexData {
pub fn is_wrap(&self) -> bool {
match self.wrap_type {
@@ -228,9 +337,78 @@ impl FlexData {
#[derive(Debug, Clone, PartialEq)]
pub struct GridData {
+ pub direction: GridDirection,
pub rows: Vec,
pub columns: Vec,
- // layout-grid-cells ;; map of id->grid-cell
+ pub cells: Vec,
+}
+
+impl GridData {
+ pub fn default() -> Self {
+ Self {
+ direction: GridDirection::Row,
+ rows: vec![],
+ columns: vec![],
+ cells: vec![],
+ }
+ }
+}
+
+#[derive(Debug)]
+#[repr(C)]
+pub struct RawGridTrack {
+ track_type: u8,
+ value: [u8; 4],
+}
+
+impl RawGridTrack {
+ pub fn from_bytes(bytes: [u8; 5]) -> Self {
+ Self {
+ track_type: bytes[0],
+ value: [bytes[1], bytes[2], bytes[3], bytes[4]],
+ }
+ }
+}
+
+#[derive(Debug)]
+#[repr(C)]
+pub struct RawGridCell {
+ row: [u8; 4],
+ row_span: [u8; 4],
+ column: [u8; 4],
+ column_span: [u8; 4],
+ has_align_self: u8,
+ align_self: u8,
+ has_justify_self: u8,
+ justify_self: u8,
+ has_shape_id: u8,
+ shape_id_a: [u8; 4],
+ shape_id_b: [u8; 4],
+ shape_id_c: [u8; 4],
+ shape_id_d: [u8; 4],
+}
+
+impl RawGridCell {
+ pub fn from_bytes(bytes: [u8; 37]) -> Self {
+ Self {
+ row: [bytes[0], bytes[1], bytes[2], bytes[3]],
+ row_span: [bytes[4], bytes[5], bytes[6], bytes[7]],
+ column: [bytes[8], bytes[9], bytes[10], bytes[11]],
+ column_span: [bytes[12], bytes[13], bytes[14], bytes[15]],
+
+ has_align_self: bytes[16],
+ align_self: bytes[17],
+
+ has_justify_self: bytes[18],
+ justify_self: bytes[19],
+
+ has_shape_id: bytes[20],
+ shape_id_a: [bytes[21], bytes[22], bytes[23], bytes[24]],
+ shape_id_b: [bytes[25], bytes[26], bytes[27], bytes[28]],
+ shape_id_c: [bytes[29], bytes[30], bytes[31], bytes[32]],
+ shape_id_d: [bytes[33], bytes[34], bytes[35], bytes[36]],
+ }
+ }
}
#[derive(Debug, Clone, PartialEq, Copy)]
diff --git a/render-wasm/src/shapes/modifiers.rs b/render-wasm/src/shapes/modifiers.rs
index 2ca02ffaa0..491b5ba7e6 100644
--- a/render-wasm/src/shapes/modifiers.rs
+++ b/render-wasm/src/shapes/modifiers.rs
@@ -1,19 +1,18 @@
use std::collections::{HashMap, HashSet, VecDeque};
-
mod common;
mod constraints;
mod flex_layout;
mod grid_layout;
-use uuid::Uuid;
-
use common::GetBounds;
-use crate::math::{Bounds, Matrix, Point};
+use crate::math::{identitish, Bounds, Matrix, Point};
use crate::shapes::{
- ConstraintH, ConstraintV, Frame, Group, Layout, Modifier, Shape, TransformEntry, Type,
+ modified_children_ids, ConstraintH, ConstraintV, Frame, Group, Layout, Modifier, Shape,
+ StructureEntry, TransformEntry, Type,
};
use crate::state::State;
+use crate::uuid::Uuid;
fn propagate_children(
shape: &Shape,
@@ -22,14 +21,17 @@ fn propagate_children(
parent_bounds_after: &Bounds,
transform: Matrix,
bounds: &HashMap,
+ structure: &HashMap>,
) -> VecDeque {
- if shape.children.len() == 0 {
+ let children_ids = modified_children_ids(shape, structure.get(&shape.id));
+
+ if children_ids.len() == 0 || identitish(transform) {
return VecDeque::new();
}
let mut result = VecDeque::new();
- for child_id in shape.children.iter() {
+ for child_id in children_ids.iter() {
let Some(child) = shapes.get(child_id) else {
continue;
};
@@ -39,7 +41,13 @@ fn propagate_children(
let constraint_h = match &shape.shape_type {
Type::Frame(Frame {
layout: Some(_), ..
- }) => ConstraintH::Left,
+ }) => {
+ if child.is_absolute() {
+ child.constraint_h(ConstraintH::Left)
+ } else {
+ ConstraintH::Left
+ }
+ }
Type::Frame(_) => child.constraint_h(ConstraintH::Left),
_ => child.constraint_h(ConstraintH::Scale),
};
@@ -47,7 +55,13 @@ fn propagate_children(
let constraint_v = match &shape.shape_type {
Type::Frame(Frame {
layout: Some(_), ..
- }) => ConstraintV::Top,
+ }) => {
+ if child.is_absolute() {
+ child.constraint_v(ConstraintV::Top)
+ } else {
+ ConstraintV::Top
+ }
+ }
Type::Frame(_) => child.constraint_v(ConstraintV::Top),
_ => child.constraint_v(ConstraintV::Scale),
};
@@ -71,10 +85,13 @@ fn calculate_group_bounds(
shape: &Shape,
shapes: &HashMap,
bounds: &HashMap,
+ structure: &HashMap>,
) -> Option {
let shape_bounds = bounds.find(&shape);
let mut result = Vec::::new();
- for child_id in shape.children.iter() {
+
+ let children_ids = modified_children_ids(shape, structure.get(&shape.id));
+ for child_id in children_ids.iter() {
let Some(child) = shapes.get(child_id) else {
continue;
};
@@ -93,6 +110,13 @@ pub fn propagate_modifiers(state: &State, modifiers: Vec) -> Vec
.iter()
.map(|entry| Modifier::Transform(entry.clone()))
.collect();
+
+ for (id, _) in &state.structure {
+ if id != &Uuid::nil() {
+ entries.push_back(Modifier::Reflow(*id));
+ }
+ }
+
let mut modifiers = HashMap::::new();
let mut bounds = HashMap::::new();
@@ -108,7 +132,6 @@ pub fn propagate_modifiers(state: &State, modifiers: Vec) -> Vec
while let Some(modifier) = entries.pop_front() {
match modifier {
Modifier::Transform(entry) => {
- // println!("Transform {}", entry.id);
let Some(shape) = state.shapes.get(&entry.id) else {
continue;
};
@@ -124,6 +147,7 @@ pub fn propagate_modifiers(state: &State, modifiers: Vec) -> Vec
&shape_bounds_after,
entry.transform,
&bounds,
+ &state.structure,
);
entries.append(&mut children);
@@ -149,26 +173,53 @@ pub fn propagate_modifiers(state: &State, modifiers: Vec) -> Vec
continue;
};
+ let mut reflow_parent = false;
+
match &shape.shape_type {
Type::Frame(Frame {
layout: Some(_), ..
}) => {
if !reflown.contains(&id) {
- layout_reflows.push(id);
- reflown.insert(id);
+ let mut skip_reflow = false;
+ if shape.is_layout_horizontal_fill()
+ || shape.is_layout_vertical_fill()
+ {
+ if let Some(parent_id) = shape.parent_id {
+ if !reflown.contains(&parent_id) {
+ // If this is a fill layout but the parent has not been reflown yet
+ // we wait for the next iteration for reflow
+ skip_reflow = true;
+ reflow_parent = true;
+ }
+ }
+ }
+
+ if shape.is_layout_vertical_auto()
+ || shape.is_layout_horizontal_auto()
+ {
+ reflow_parent = true;
+ }
+
+ if !skip_reflow {
+ layout_reflows.push(id);
+ }
}
}
Type::Group(Group { masked: true }) => {
- if let Some(child) = shapes.get(&shape.children[0]) {
+ let children_ids =
+ modified_children_ids(shape, state.structure.get(&shape.id));
+ if let Some(child) = shapes.get(&children_ids[0]) {
let child_bounds = bounds.find(&child);
bounds.insert(shape.id, child_bounds);
+ reflow_parent = true;
}
}
Type::Group(_) => {
if let Some(shape_bounds) =
- calculate_group_bounds(shape, shapes, &bounds)
+ calculate_group_bounds(shape, shapes, &bounds, &state.structure)
{
bounds.insert(shape.id, shape_bounds);
+ reflow_parent = true;
}
}
Type::Bool(_) => {
@@ -176,9 +227,10 @@ pub fn propagate_modifiers(state: &State, modifiers: Vec) -> Vec
// new path... impossible right now. I'm going to use for the moment the group
// calculation
if let Some(shape_bounds) =
- calculate_group_bounds(shape, shapes, &bounds)
+ calculate_group_bounds(shape, shapes, &bounds, &state.structure)
{
bounds.insert(shape.id, shape_bounds);
+ reflow_parent = true;
}
}
_ => {
@@ -187,7 +239,7 @@ pub fn propagate_modifiers(state: &State, modifiers: Vec) -> Vec
}
if let Some(parent) = shape.parent_id.and_then(|id| shapes.get(&id)) {
- if parent.has_layout() || parent.is_group_like() {
+ if reflow_parent && (parent.has_layout() || parent.is_group_like()) {
entries.push_back(Modifier::reflow(parent.id));
}
}
@@ -196,6 +248,10 @@ pub fn propagate_modifiers(state: &State, modifiers: Vec) -> Vec
}
for id in layout_reflows.iter() {
+ if reflown.contains(&id) {
+ continue;
+ }
+
let Some(shape) = state.shapes.get(&id) else {
continue;
};
@@ -205,16 +261,29 @@ pub fn propagate_modifiers(state: &State, modifiers: Vec) -> Vec
};
if let Some(Layout::FlexLayout(layout_data, flex_data)) = &frame_data.layout {
- let mut children =
- flex_layout::reflow_flex_layout(shape, layout_data, flex_data, shapes, &bounds);
+ let mut children = flex_layout::reflow_flex_layout(
+ shape,
+ layout_data,
+ flex_data,
+ shapes,
+ &mut bounds,
+ &state.structure,
+ );
entries.append(&mut children);
}
if let Some(Layout::GridLayout(layout_data, grid_data)) = &frame_data.layout {
- let mut children =
- grid_layout::reflow_grid_layout(shape, layout_data, grid_data, shapes, &bounds);
+ let mut children = grid_layout::reflow_grid_layout(
+ shape,
+ layout_data,
+ grid_data,
+ shapes,
+ &mut bounds,
+ &state.structure,
+ );
entries.append(&mut children);
}
+ reflown.insert(*id);
}
layout_reflows = Vec::new();
}
@@ -263,7 +332,8 @@ mod tests {
&bounds_before,
&bounds_after,
transform,
- &HashMap::::new(),
+ &HashMap::new(),
+ &HashMap::new(),
);
assert_eq!(result.len(), 1);
@@ -292,7 +362,7 @@ mod tests {
shapes.insert(parent_id, parent.clone());
let bounds =
- calculate_group_bounds(&parent, &shapes, HashMap::::new()).unwrap();
+ calculate_group_bounds(&parent, &shapes, &HashMap::new(), &HashMap::new()).unwrap();
assert_eq!(bounds.width(), 3.0);
assert_eq!(bounds.height(), 3.0);
diff --git a/render-wasm/src/shapes/modifiers/common.rs b/render-wasm/src/shapes/modifiers/common.rs
index 9324adb90f..8b071ee542 100644
--- a/render-wasm/src/shapes/modifiers/common.rs
+++ b/render-wasm/src/shapes/modifiers/common.rs
@@ -1,8 +1,8 @@
use std::collections::HashMap;
-use uuid::Uuid;
use crate::math::Bounds;
use crate::shapes::Shape;
+use crate::uuid::Uuid;
pub trait GetBounds {
fn find(&self, shape: &Shape) -> Bounds;
diff --git a/render-wasm/src/shapes/modifiers/flex_layout.rs b/render-wasm/src/shapes/modifiers/flex_layout.rs
index 10ec4caffa..51022a35fb 100644
--- a/render-wasm/src/shapes/modifiers/flex_layout.rs
+++ b/render-wasm/src/shapes/modifiers/flex_layout.rs
@@ -1,11 +1,12 @@
#![allow(dead_code)]
use crate::math::{self as math, Bounds, Matrix, Point, Vector, VectorExt};
use crate::shapes::{
- AlignContent, AlignItems, AlignSelf, FlexData, JustifyContent, LayoutData, LayoutItem,
- Modifier, Shape,
+ modified_children_ids, AlignContent, AlignItems, AlignSelf, FlexData, JustifyContent,
+ LayoutData, LayoutItem, Modifier, Shape, StructureEntry,
};
+use crate::uuid::Uuid;
+
use std::collections::{HashMap, VecDeque};
-use uuid::Uuid;
use super::common::GetBounds;
@@ -67,7 +68,7 @@ impl LayoutAxis {
layout_data: &LayoutData,
flex_data: &FlexData,
) -> Self {
- if layout_data.is_row() {
+ if flex_data.is_row() {
Self {
main_size: layout_bounds.width(),
across_size: layout_bounds.height(),
@@ -77,8 +78,8 @@ impl LayoutAxis {
padding_main_end: layout_data.padding_right,
padding_across_start: layout_data.padding_top,
padding_across_end: layout_data.padding_bottom,
- gap_main: flex_data.column_gap,
- gap_across: flex_data.row_gap,
+ gap_main: layout_data.column_gap,
+ gap_across: layout_data.row_gap,
is_auto_main: shape.is_layout_horizontal_auto(),
is_auto_across: shape.is_layout_vertical_auto(),
}
@@ -92,8 +93,8 @@ impl LayoutAxis {
padding_main_end: layout_data.padding_bottom,
padding_across_start: layout_data.padding_left,
padding_across_end: layout_data.padding_right,
- gap_main: flex_data.row_gap,
- gap_across: flex_data.column_gap,
+ gap_main: layout_data.row_gap,
+ gap_across: layout_data.column_gap,
is_auto_main: shape.is_layout_vertical_auto(),
is_auto_across: shape.is_layout_horizontal_auto(),
}
@@ -116,15 +117,15 @@ struct ChildAxis {
max_across_size: f32,
is_fill_main: bool,
is_fill_across: bool,
- is_absolute: bool,
z_index: i32,
+ bounds: Bounds,
}
impl ChildAxis {
- fn new(child: &Shape, child_bounds: &Bounds, layout_data: &LayoutData) -> Self {
+ fn new(child: &Shape, child_bounds: &Bounds, flex_data: &FlexData) -> Self {
let id = child.id;
let layout_item = child.layout_item;
- let mut result = if layout_data.is_row() {
+ let mut result = if flex_data.is_row() {
Self {
id,
main_size: child_bounds.width(),
@@ -139,8 +140,8 @@ impl ChildAxis {
max_across_size: layout_item.and_then(|i| i.max_h).unwrap_or(MAX_SIZE),
is_fill_main: child.is_layout_horizontal_fill(),
is_fill_across: child.is_layout_vertical_fill(),
- is_absolute: layout_item.map(|i| i.is_absolute).unwrap_or(false),
z_index: layout_item.map(|i| i.z_index).unwrap_or(0),
+ bounds: child_bounds.clone(),
}
} else {
Self {
@@ -157,8 +158,8 @@ impl ChildAxis {
max_main_size: layout_item.and_then(|i| i.max_h).unwrap_or(MAX_SIZE),
is_fill_main: child.is_layout_vertical_fill(),
is_fill_across: child.is_layout_horizontal_fill(),
- is_absolute: layout_item.map(|i| i.is_absolute).unwrap_or(false),
z_index: layout_item.map(|i| i.z_index).unwrap_or(0),
+ bounds: child_bounds.clone(),
}
};
@@ -174,18 +175,19 @@ impl ChildAxis {
fn initialize_tracks(
shape: &Shape,
+ layout_bounds: &Bounds,
layout_axis: &LayoutAxis,
- layout_data: &LayoutData,
flex_data: &FlexData,
shapes: &HashMap,
bounds: &HashMap,
+ structure: &HashMap>,
) -> Vec {
let mut tracks = Vec::::new();
let mut current_track = TrackData::default();
- let mut children = shape.children.clone();
+ let mut children = modified_children_ids(shape, structure.get(&shape.id));
let mut first = true;
- if !layout_data.is_reverse() {
+ if !flex_data.is_reverse() {
children.reverse();
}
@@ -194,19 +196,32 @@ fn initialize_tracks(
continue;
};
- let child_bounds = bounds.find(child);
- let child_axis = ChildAxis::new(child, &child_bounds, layout_data);
+ if child.is_absolute() || child.hidden() {
+ continue;
+ }
- let child_main_size = if child_axis.is_fill_main {
- child_axis.min_main_size
- } else {
- child_axis.main_size
- };
- let child_across_size = if child_axis.is_fill_across {
- child_axis.min_across_size
- } else {
- child_axis.across_size
- };
+ let default_bounds = bounds.find(child);
+ let child_bounds = layout_bounds
+ .box_bounds(&default_bounds)
+ .unwrap_or(default_bounds);
+
+ let child_axis = ChildAxis::new(child, &child_bounds, flex_data);
+
+ let child_main_size = child_axis.margin_main_start
+ + child_axis.margin_main_end
+ + if child_axis.is_fill_main {
+ child_axis.min_main_size
+ } else {
+ child_axis.main_size
+ };
+
+ let child_across_size = child_axis.margin_across_start
+ + child_axis.margin_across_end
+ + if child_axis.is_fill_across {
+ child_axis.min_across_size
+ } else {
+ child_axis.across_size
+ };
let child_max_across_size = if child_axis.is_fill_across {
child_axis.max_across_size
@@ -271,6 +286,7 @@ fn distribute_fill_main_space(layout_axis: &LayoutAxis, tracks: &mut Vec {
- let total_across_size_gap: f32 =
- total_across_size + (tracks.len() - 1) as f32 * layout_axis.gap_across;
+ let total_across_size_gap: f32 =
+ total_across_size + (tracks.len() - 1) as f32 * layout_axis.gap_across;
- let delta =
- layout_axis.across_size - total_across_size_gap - layout_axis.padding_across_end;
- let mut next_anchor = layout_bounds.nw + layout_axis.across_v * delta;
+ let (real_margin, real_gap) = match align_content {
+ AlignContent::End => (
+ layout_axis.across_size - total_across_size_gap - layout_axis.padding_across_end,
+ layout_axis.gap_across,
+ ),
- for track in tracks.iter_mut() {
- track.anchor = next_anchor;
- next_anchor = next_anchor
- + layout_axis.across_v * (track.across_size + layout_axis.gap_across);
- }
- }
+ AlignContent::Center => (
+ (layout_axis.across_size - total_across_size_gap) / 2.0,
+ layout_axis.gap_across,
+ ),
- AlignContent::Center => {
- let total_across_size_gap: f32 =
- total_across_size + (tracks.len() - 1) as f32 * layout_axis.gap_across;
- let center_margin = (layout_axis.across_size - total_across_size_gap) / 2.0;
-
- let mut next_anchor = layout_bounds.nw + layout_axis.across_v * center_margin;
-
- for track in tracks.iter_mut() {
- track.anchor = next_anchor;
- next_anchor = next_anchor
- + layout_axis.across_v * (track.across_size + layout_axis.gap_across);
- }
- }
-
- AlignContent::SpaceBetween => {
- let mut next_anchor =
- layout_bounds.nw + layout_axis.across_v * layout_axis.padding_across_start;
-
- let effective_gap = f32::max(
+ AlignContent::SpaceBetween => (
+ layout_axis.padding_across_start,
+ f32::max(
layout_axis.gap_across,
(layout_axis.across_space() - total_across_size) / (tracks.len() - 1) as f32,
- );
-
- for track in tracks.iter_mut() {
- track.anchor = next_anchor;
- next_anchor =
- next_anchor + layout_axis.across_v * (track.across_size + effective_gap);
- }
- }
+ ),
+ ),
AlignContent::SpaceAround => {
let effective_gap =
(layout_axis.across_space() - total_across_size) / tracks.len() as f32;
-
- let mut next_anchor = layout_bounds.nw
- + layout_axis.across_v * (layout_axis.padding_across_start + effective_gap / 2.0);
-
- for track in tracks.iter_mut() {
- track.anchor = next_anchor;
- next_anchor =
- next_anchor + layout_axis.across_v * (track.across_size + effective_gap);
- }
+ (effective_gap / 2.0, effective_gap)
}
AlignContent::SpaceEvenly => {
let effective_gap =
(layout_axis.across_space() - total_across_size) / (tracks.len() + 1) as f32;
-
- let mut next_anchor = layout_bounds.nw
- + layout_axis.across_v * (layout_axis.padding_across_start + effective_gap);
-
- for track in tracks.iter_mut() {
- track.anchor = next_anchor;
- next_anchor =
- next_anchor + layout_axis.across_v * (track.across_size + effective_gap);
- }
+ (
+ layout_axis.padding_across_start + effective_gap,
+ effective_gap,
+ )
}
- _ => {
- let mut next_anchor =
- layout_bounds.nw + layout_axis.across_v * layout_axis.padding_across_start;
+ _ => (layout_axis.padding_across_start, layout_axis.gap_across),
+ };
- for track in tracks.iter_mut() {
- track.anchor = next_anchor;
- next_anchor = next_anchor
- + layout_axis.across_v * (track.across_size + layout_axis.gap_across);
- }
- }
+ let mut next_anchor = layout_bounds.nw + layout_axis.across_v * real_margin;
+
+ for track in tracks.iter_mut() {
+ track.anchor = next_anchor;
+ next_anchor = next_anchor + layout_axis.across_v * real_gap;
}
}
@@ -444,9 +422,18 @@ fn calculate_track_data(
layout_bounds: &Bounds,
shapes: &HashMap,
bounds: &HashMap,
+ structure: &HashMap>,
) -> Vec {
let layout_axis = LayoutAxis::new(shape, layout_bounds, layout_data, flex_data);
- let mut tracks = initialize_tracks(shape, &layout_axis, layout_data, flex_data, shapes, bounds);
+ let mut tracks = initialize_tracks(
+ shape,
+ layout_bounds,
+ &layout_axis,
+ flex_data,
+ shapes,
+ bounds,
+ structure,
+ );
if !layout_axis.is_auto_main {
distribute_fill_main_space(&layout_axis, &mut tracks);
@@ -510,24 +497,26 @@ fn next_anchor(
prev_anchor: Point,
total_shapes_size: f32,
) -> Point {
- let delta = match layout_data.justify_content {
- JustifyContent::SpaceBetween => {
- let effective_gap =
- (layout_axis.main_space() - total_shapes_size) / (track.shapes.len() - 1) as f32;
- child_axis.main_size + f32::max(layout_axis.gap_main, effective_gap)
- }
- JustifyContent::SpaceAround => {
- let effective_gap =
- (layout_axis.main_space() - total_shapes_size) / (track.shapes.len()) as f32;
- child_axis.main_size + f32::max(layout_axis.gap_main, effective_gap)
- }
- JustifyContent::SpaceEvenly => {
- let effective_gap =
- (layout_axis.main_space() - total_shapes_size) / (track.shapes.len() + 1) as f32;
- child_axis.main_size + f32::max(layout_axis.gap_main, effective_gap)
- }
- _ => child_axis.main_size + layout_axis.gap_main,
- };
+ let delta = child_axis.margin_main_start
+ + child_axis.margin_main_end
+ + match layout_data.justify_content {
+ JustifyContent::SpaceBetween => {
+ let effective_gap = (layout_axis.main_space() - total_shapes_size)
+ / (track.shapes.len() - 1) as f32;
+ child_axis.main_size + f32::max(layout_axis.gap_main, effective_gap)
+ }
+ JustifyContent::SpaceAround => {
+ let effective_gap =
+ (layout_axis.main_space() - total_shapes_size) / (track.shapes.len()) as f32;
+ child_axis.main_size + f32::max(layout_axis.gap_main, effective_gap)
+ }
+ JustifyContent::SpaceEvenly => {
+ let effective_gap = (layout_axis.main_space() - total_shapes_size)
+ / (track.shapes.len() + 1) as f32;
+ child_axis.main_size + f32::max(layout_axis.gap_main, effective_gap)
+ }
+ _ => child_axis.main_size + layout_axis.gap_main,
+ };
prev_anchor + layout_axis.main_v * delta
}
@@ -539,22 +528,23 @@ fn child_position(
child_axis: &ChildAxis,
track: &TrackData,
) -> Point {
- let delta = match child.layout_item {
- Some(LayoutItem {
- align_self: Some(align_self),
- ..
- }) => match align_self {
- AlignSelf::Center => (track.across_size - child_axis.across_size) / 2.0,
- AlignSelf::End => track.across_size - child_axis.across_size,
- _ => 0.0,
- },
- _ => match layout_data.align_items {
- AlignItems::Center => (track.across_size - child_axis.across_size) / 2.0,
- AlignItems::End => track.across_size - child_axis.across_size,
- _ => 0.0,
- },
- };
- shape_anchor + layout_axis.across_v * delta
+ let delta = child_axis.margin_across_start
+ + match child.layout_item {
+ Some(LayoutItem {
+ align_self: Some(align_self),
+ ..
+ }) => match align_self {
+ AlignSelf::Center => (track.across_size - child_axis.across_size) / 2.0,
+ AlignSelf::End => track.across_size - child_axis.across_size,
+ _ => 0.0,
+ },
+ _ => match layout_data.align_items {
+ AlignItems::Center => (track.across_size - child_axis.across_size) / 2.0,
+ AlignItems::End => track.across_size - child_axis.across_size,
+ _ => 0.0,
+ },
+ };
+ shape_anchor + layout_axis.main_v * child_axis.margin_main_start + layout_axis.across_v * delta
}
pub fn reflow_flex_layout(
@@ -562,12 +552,21 @@ pub fn reflow_flex_layout(
layout_data: &LayoutData,
flex_data: &FlexData,
shapes: &HashMap,
- bounds: &HashMap,
+ bounds: &mut HashMap,
+ structure: &HashMap>,
) -> VecDeque {
let mut result = VecDeque::new();
let layout_bounds = &bounds.find(&shape);
let layout_axis = LayoutAxis::new(shape, layout_bounds, layout_data, flex_data);
- let tracks = calculate_track_data(shape, layout_data, flex_data, layout_bounds, shapes, bounds);
+ let tracks = calculate_track_data(
+ shape,
+ layout_data,
+ flex_data,
+ layout_bounds,
+ shapes,
+ bounds,
+ structure,
+ );
for track in tracks.iter() {
let total_shapes_size = track.shapes.iter().map(|s| s.main_size).sum::();
@@ -587,10 +586,10 @@ pub fn reflow_flex_layout(
child_axis,
track,
);
- let child_bounds = bounds.find(child);
+ let child_bounds = &child_axis.bounds;
let delta_v = Vector::new_points(&child_bounds.nw, &position);
- let (new_width, new_height) = if layout_data.is_row() {
+ let (new_width, new_height) = if flex_data.is_row() {
(child_axis.main_size, child_axis.across_size)
} else {
(child_axis.across_size, child_axis.main_size)
@@ -633,8 +632,8 @@ pub fn reflow_flex_layout(
let auto_across_size = if layout_axis.is_auto_across {
tracks.iter().map(|track| track.across_size).sum::()
+ (tracks.len() - 1) as f32 * layout_axis.gap_across
- + layout_axis.padding_main_start
- + layout_axis.padding_main_end
+ + layout_axis.padding_across_start
+ + layout_axis.padding_across_end
} else {
0.0
};
@@ -648,13 +647,13 @@ pub fn reflow_flex_layout(
})
.reduce(f32::max)
.unwrap_or(0.01)
- + layout_axis.padding_across_start
- + layout_axis.padding_across_end
+ + layout_axis.padding_main_start
+ + layout_axis.padding_main_end
} else {
0.0
};
- let (scale_width, scale_height) = if layout_data.is_row() {
+ let (scale_width, scale_height) = if flex_data.is_row() {
(
if layout_axis.is_auto_main {
auto_main_size / width
@@ -695,7 +694,9 @@ pub fn reflow_flex_layout(
scale.pre_translate(-origin);
scale.pre_concat(&parent_transform_inv);
+ let layout_bounds_after = layout_bounds.transform(&scale);
result.push_back(Modifier::parent(shape.id, scale));
+ bounds.insert(shape.id, layout_bounds_after);
}
result
}
diff --git a/render-wasm/src/shapes/modifiers/grid_layout.rs b/render-wasm/src/shapes/modifiers/grid_layout.rs
index 26714cbb04..bbac9efa2d 100644
--- a/render-wasm/src/shapes/modifiers/grid_layout.rs
+++ b/render-wasm/src/shapes/modifiers/grid_layout.rs
@@ -1,15 +1,755 @@
-use crate::math::Bounds;
-use crate::shapes::{GridData, LayoutData, Modifier, Shape};
+use crate::math::{self as math, intersect_rays, Bounds, Matrix, Point, Ray, Vector, VectorExt};
+use crate::shapes::{
+ modified_children_ids, AlignContent, AlignItems, AlignSelf, GridCell, GridData, GridTrack,
+ GridTrackType, JustifyContent, JustifyItems, JustifySelf, LayoutData, LayoutItem, Modifier,
+ Shape, StructureEntry,
+};
+use crate::uuid::Uuid;
+use indexmap::IndexSet;
use std::collections::{HashMap, VecDeque};
-use uuid::Uuid;
-pub fn reflow_grid_layout(
- _shape: &Shape,
- _layout_data: &LayoutData,
- _grid_data: &GridData,
- _shapes: &HashMap,
- _bounds: &HashMap,
-) -> VecDeque {
- // TODO
- VecDeque::new()
+use super::common::GetBounds;
+
+const MIN_SIZE: f32 = 0.01;
+const MAX_SIZE: f32 = f32::INFINITY;
+
+#[derive(Debug)]
+struct CellData<'a> {
+ shape: &'a Shape,
+ anchor: Point,
+ width: f32,
+ height: f32,
+ align_self: Option,
+ justify_self: Option,
+}
+
+#[derive(Debug)]
+struct TrackData {
+ track_type: GridTrackType,
+ value: f32,
+ size: f32,
+ max_size: f32,
+ anchor_start: Point,
+ anchor_end: Point,
+}
+
+fn calculate_tracks(
+ is_column: bool,
+ shape: &Shape,
+ layout_data: &LayoutData,
+ grid_data: &GridData,
+ layout_bounds: &Bounds,
+ cells: &Vec,
+ shapes: &HashMap,
+ bounds: &HashMap,
+) -> Vec {
+ let layout_size = if is_column {
+ layout_bounds.width() - layout_data.padding_left - layout_data.padding_right
+ } else {
+ layout_bounds.height() - layout_data.padding_top - layout_data.padding_bottom
+ };
+
+ let grid_tracks = if is_column {
+ &grid_data.columns
+ } else {
+ &grid_data.rows
+ };
+
+ let mut tracks = init_tracks(grid_tracks, layout_size);
+ set_auto_base_size(is_column, &mut tracks, cells, shapes, bounds);
+ set_auto_multi_span(is_column, &mut tracks, cells, shapes, bounds);
+ set_flex_multi_span(is_column, &mut tracks, cells, shapes, bounds);
+ set_fr_value(is_column, shape, layout_data, &mut tracks, layout_size);
+ stretch_tracks(is_column, shape, layout_data, &mut tracks, layout_size);
+ assign_anchors(is_column, layout_data, &layout_bounds, &mut tracks);
+ return tracks;
+}
+
+fn init_tracks(track: &Vec, size: f32) -> Vec {
+ track
+ .iter()
+ .map(|t| {
+ let (size, max_size) = match t.track_type {
+ GridTrackType::Fixed => (t.value, t.value),
+ GridTrackType::Percent => (size * t.value / 100.0, size * t.value / 100.0),
+ _ => (MIN_SIZE, MAX_SIZE),
+ };
+ TrackData {
+ track_type: t.track_type,
+ value: t.value,
+ size,
+ max_size,
+ anchor_start: Point::default(),
+ anchor_end: Point::default(),
+ }
+ })
+ .collect()
+}
+
+fn min_size(column: bool, shape: &Shape, bounds: &HashMap) -> f32 {
+ if column && shape.is_layout_horizontal_fill() {
+ shape.layout_item.and_then(|i| i.min_w).unwrap_or(MIN_SIZE)
+ } else if !column && shape.is_layout_vertical_fill() {
+ shape.layout_item.and_then(|i| i.min_h).unwrap_or(MIN_SIZE)
+ } else if column {
+ let bounds = bounds.find(shape);
+ bounds.width()
+ } else {
+ let bounds = bounds.find(shape);
+ bounds.height()
+ }
+}
+
+// Go through cells to adjust auto sizes for span=1. Base is the max of its children
+fn set_auto_base_size(
+ column: bool,
+ tracks: &mut Vec,
+ cells: &Vec,
+ shapes: &HashMap,
+ bounds: &HashMap,
+) {
+ for cell in cells {
+ let (prop, prop_span) = if column {
+ (cell.column, cell.column_span)
+ } else {
+ (cell.row, cell.row_span)
+ };
+
+ if prop_span != 1 || (prop as usize) >= tracks.len() {
+ continue;
+ }
+
+ let track = &mut tracks[(prop - 1) as usize];
+
+ // We change the size for auto+flex tracks
+ if track.track_type != GridTrackType::Auto && track.track_type != GridTrackType::Flex {
+ continue;
+ }
+
+ let Some(shape) = cell.shape.and_then(|id| shapes.get(&id)) else {
+ continue;
+ };
+
+ let min_size = min_size(column, shape, bounds);
+ track.size = f32::max(track.size, min_size);
+ }
+}
+
+fn track_index(is_column: bool, c: &GridCell) -> (usize, usize) {
+ if is_column {
+ (
+ (c.column - 1) as usize,
+ (c.column + c.column_span - 1) as usize,
+ )
+ } else {
+ ((c.row - 1) as usize, (c.row + c.row_span - 1) as usize)
+ }
+}
+
+fn has_flex(is_column: bool, cell: &GridCell, tracks: &mut Vec) -> bool {
+ let (start, end) = track_index(is_column, cell);
+ (start..end).any(|i| tracks[i].track_type == GridTrackType::Flex)
+}
+
+// Adjust multi-spaned cells with no flex columns
+fn set_auto_multi_span(
+ column: bool,
+ tracks: &mut Vec,
+ cells: &Vec,
+ shapes: &HashMap,
+ bounds: &HashMap,
+) {
+ // Remove groups with flex (will be set in flex_multi_span)
+ let mut selected_cells: Vec<&GridCell> = cells
+ .iter()
+ .filter(|c| {
+ if column {
+ c.column_span > 1
+ } else {
+ c.row_span > 1
+ }
+ })
+ .filter(|c| !has_flex(column, c, tracks))
+ .collect();
+
+ // Sort descendant order of prop-span
+ selected_cells.sort_by(|a, b| {
+ if column {
+ b.column_span.cmp(&a.row_span)
+ } else {
+ b.row_span.cmp(&a.row_span)
+ }
+ });
+
+ for cell in selected_cells {
+ let Some(child) = cell.shape.and_then(|id| shapes.get(&id)) else {
+ continue;
+ };
+
+ // Retrieve the value we need to distribute (fixed cell size minus gaps)
+ let mut dist = min_size(column, child, bounds);
+ let mut num_auto = 0;
+
+ let (start, end) = track_index(column, cell);
+
+ // Distribute the size between the tracks that already have a set value
+ for i in start..end {
+ dist = dist - tracks[i].size;
+
+ if tracks[i].track_type == GridTrackType::Auto {
+ num_auto = num_auto + 1;
+ }
+ }
+
+ // If we still have more space we distribute equally between all auto tracks
+ while dist > MIN_SIZE && num_auto > 0 {
+ let rest = dist / num_auto as f32;
+
+ // Distribute the space between auto tracks
+ for i in start..end {
+ if tracks[i].track_type == GridTrackType::Auto {
+ // dist = dist - track[i].size;
+ let new_size = if tracks[i].size + rest < tracks[i].max_size {
+ tracks[i].size + rest
+ } else {
+ num_auto = num_auto - 1;
+ tracks[i].max_size
+ };
+
+ let aloc = new_size - tracks[i].size;
+ dist = dist - aloc;
+ tracks[i].size = tracks[i].size + aloc;
+ }
+ }
+ }
+ }
+}
+
+// Adjust multi-spaned cells with flex columns
+fn set_flex_multi_span(
+ column: bool,
+ tracks: &mut Vec,
+ cells: &Vec,
+ shapes: &HashMap,
+ bounds: &HashMap,
+) {
+ // Remove groups without flex
+ let mut selected_cells: Vec<&GridCell> = cells
+ .iter()
+ .filter(|c| {
+ if column {
+ c.column_span > 1
+ } else {
+ c.row_span > 1
+ }
+ })
+ .filter(|c| has_flex(column, c, tracks))
+ .collect();
+
+ // Sort descendant order of prop-span
+ selected_cells.sort_by(|a, b| {
+ if column {
+ b.column_span.cmp(&a.row_span)
+ } else {
+ b.row_span.cmp(&a.row_span)
+ }
+ });
+
+ // Retrieve the value that we need to distribute and the number of frs
+ for cell in selected_cells {
+ let Some(child) = cell.shape.and_then(|id| shapes.get(&id)) else {
+ continue;
+ };
+
+ // Retrieve the value we need to distribute (fixed cell size minus gaps)
+ let mut dist = min_size(column, child, bounds);
+ let mut num_flex = 0.0;
+ let mut num_auto = 0;
+
+ let (start, end) = track_index(column, cell);
+
+ // Distribute the size between the tracks that already have a set value
+ for i in start..end {
+ dist = dist - tracks[i].size;
+
+ match tracks[i].track_type {
+ GridTrackType::Flex => {
+ num_flex = num_flex + tracks[i].value;
+ num_auto = num_auto + 1;
+ }
+ GridTrackType::Auto => {
+ num_auto = num_auto + 1;
+ }
+ _ => {}
+ }
+ }
+
+ if dist <= MIN_SIZE {
+ // No space available to distribute
+ continue;
+ }
+
+ let rest = dist / num_flex as f32;
+
+ // Distribute the space between flex tracks in proportion to the division
+ for i in start..end {
+ if tracks[i].track_type == GridTrackType::Flex {
+ let new_size = f32::min(tracks[i].size + rest, tracks[i].max_size);
+ let aloc = new_size - tracks[i].size;
+ dist = dist - aloc;
+ tracks[i].size = tracks[i].size + aloc;
+ }
+ }
+
+ // Distribute the space between auto tracks if any
+ while dist > MIN_SIZE && num_auto > 0 {
+ let rest = dist / num_auto as f32;
+
+ for i in start..end {
+ if tracks[i].track_type == GridTrackType::Auto
+ || tracks[i].track_type == GridTrackType::Flex
+ {
+ let new_size = if tracks[i].size + rest < tracks[i].max_size {
+ tracks[i].size + rest
+ } else {
+ num_auto = num_auto - 1;
+ tracks[i].max_size
+ };
+
+ let aloc = new_size - tracks[i].size;
+ dist = dist - aloc;
+ tracks[i].size = tracks[i].size + aloc;
+ }
+ }
+ }
+ }
+}
+
+// Calculate the `fr` unit and adjust the size
+fn set_fr_value(
+ column: bool,
+ shape: &Shape,
+ layout_data: &LayoutData,
+ tracks: &mut Vec,
+ layout_size: f32,
+) {
+ let tot_gap: f32 = if column {
+ layout_data.column_gap * (tracks.len() - 1) as f32
+ } else {
+ layout_data.row_gap * (tracks.len() - 1) as f32
+ };
+
+ // Total size already used
+ let tot_size: f32 = tracks
+ .iter()
+ .filter(|t| t.track_type != GridTrackType::Flex)
+ .map(|t| t.size)
+ .sum::()
+ + tot_gap;
+
+ let tot_frs: f32 = tracks
+ .iter()
+ .filter(|t| t.track_type == GridTrackType::Flex)
+ .map(|t| t.value)
+ .sum();
+
+ let cur_fr_size = tracks
+ .iter()
+ .filter(|t| t.track_type == GridTrackType::Flex)
+ .map(|t| t.size / t.value)
+ .reduce(f32::max)
+ .unwrap_or(0.0);
+
+ // Divide the space between FRS
+ let fr = if column && shape.is_layout_horizontal_auto()
+ || !column && shape.is_layout_vertical_auto()
+ {
+ cur_fr_size
+ } else {
+ f32::max(cur_fr_size, (layout_size - tot_size) / tot_frs)
+ };
+
+ // Assign the space to the FRS
+ tracks
+ .iter_mut()
+ .filter(|t| t.track_type == GridTrackType::Flex)
+ .for_each(|t| t.size = f32::min(fr * t.value, t.max_size));
+}
+
+fn stretch_tracks(
+ column: bool,
+ shape: &Shape,
+ layout_data: &LayoutData,
+ tracks: &mut Vec,
+ layout_size: f32,
+) {
+ if (column
+ && (layout_data.justify_content != JustifyContent::Stretch
+ || shape.is_layout_horizontal_auto()))
+ || (!column
+ && (layout_data.align_content != AlignContent::Stretch
+ || shape.is_layout_vertical_auto()))
+ {
+ return;
+ }
+
+ let tot_gap: f32 = if column {
+ layout_data.column_gap * (tracks.len() - 1) as f32
+ } else {
+ layout_data.row_gap * (tracks.len() - 1) as f32
+ };
+
+ // Total size already used
+ let tot_size: f32 = tracks.iter().map(|t| t.size).sum::() + tot_gap;
+
+ let auto_tracks = tracks
+ .iter_mut()
+ .filter(|t| t.track_type == GridTrackType::Auto)
+ .count() as f32;
+
+ let free_space = layout_size - tot_size;
+ let add_size = free_space / auto_tracks;
+
+ // Assign the space to the FRS
+ tracks
+ .iter_mut()
+ .filter(|t| t.track_type == GridTrackType::Auto)
+ .for_each(|t| t.size = f32::min(t.max_size, t.size + add_size));
+}
+
+fn justify_to_align(justify: JustifyContent) -> AlignContent {
+ match justify {
+ JustifyContent::Start => AlignContent::Start,
+ JustifyContent::End => AlignContent::End,
+ JustifyContent::Center => AlignContent::Center,
+ JustifyContent::SpaceBetween => AlignContent::SpaceBetween,
+ JustifyContent::SpaceAround => AlignContent::SpaceAround,
+ JustifyContent::SpaceEvenly => AlignContent::SpaceEvenly,
+ JustifyContent::Stretch => AlignContent::Stretch,
+ }
+}
+
+fn assign_anchors(
+ column: bool,
+ layout_data: &LayoutData,
+ layout_bounds: &Bounds,
+ tracks: &mut Vec,
+) {
+ let tot_track_length = tracks.iter().map(|t| t.size).sum::();
+
+ let mut cursor = layout_bounds.nw;
+
+ let (v, gap, size, padding_start, padding_end, align) = if column {
+ (
+ layout_bounds.hv(1.0),
+ layout_data.column_gap,
+ layout_bounds.width(),
+ layout_data.padding_left,
+ layout_data.padding_right,
+ justify_to_align(layout_data.justify_content),
+ )
+ } else {
+ (
+ layout_bounds.vv(1.0),
+ layout_data.row_gap,
+ layout_bounds.height(),
+ layout_data.padding_top,
+ layout_data.padding_bottom,
+ layout_data.align_content,
+ )
+ };
+
+ let tot_gap = gap * (tracks.len() - 1) as f32;
+ let tot_size = tot_track_length + tot_gap;
+ let padding = padding_start + padding_end;
+ let pad_size = size - padding;
+
+ let (real_margin, real_gap) = match align {
+ AlignContent::End => (size - padding_end - tot_size, gap),
+ AlignContent::Center => ((size - tot_size) / 2.0, gap),
+ AlignContent::SpaceAround => {
+ let effective_gap = (pad_size - tot_track_length) / tracks.len() as f32;
+ (padding_start + effective_gap / 2.0, effective_gap)
+ }
+ AlignContent::SpaceBetween => (
+ padding_start,
+ f32::max(
+ gap,
+ (pad_size - tot_track_length) / (tracks.len() - 1) as f32,
+ ),
+ ),
+ _ => (padding_start + 0.0, gap),
+ };
+
+ cursor = cursor + (v * real_margin);
+
+ for track in tracks {
+ track.anchor_start = cursor;
+ track.anchor_end = cursor + (v * track.size);
+ cursor = track.anchor_end + (v * real_gap);
+ }
+}
+
+fn cell_bounds(
+ layout_bounds: &Bounds,
+ column_start: Point,
+ column_end: Point,
+ row_start: Point,
+ row_end: Point,
+) -> Option {
+ let hv = layout_bounds.hv(1.0);
+ let vv = layout_bounds.vv(1.0);
+ let nw = intersect_rays(&Ray::new(column_start, vv), &Ray::new(row_start, hv))?;
+ let ne = intersect_rays(&Ray::new(column_end, vv), &Ray::new(row_start, hv))?;
+ let sw = intersect_rays(&Ray::new(column_start, vv), &Ray::new(row_end, hv))?;
+ let se = intersect_rays(&Ray::new(column_end, vv), &Ray::new(row_end, hv))?;
+ Some(Bounds::new(nw, ne, se, sw))
+}
+
+fn create_cell_data<'a>(
+ layout_bounds: &Bounds,
+ children: &IndexSet,
+ shapes: &'a HashMap,
+ cells: &Vec,
+ column_tracks: &Vec,
+ row_tracks: &Vec,
+) -> Vec> {
+ let mut result = Vec::>::new();
+
+ for cell in cells {
+ let Some(shape_id) = cell.shape else {
+ continue;
+ };
+
+ if !children.contains(&shape_id) {
+ continue;
+ }
+
+ let Some(shape) = shapes.get(&shape_id) else {
+ continue;
+ };
+
+ let column_start = (cell.column - 1) as usize;
+ let column_end = (cell.column + cell.column_span - 2) as usize;
+ let row_start = (cell.row - 1) as usize;
+ let row_end = (cell.row + cell.row_span - 2) as usize;
+
+ if column_start >= column_tracks.len()
+ || column_end >= column_tracks.len()
+ || row_start >= row_tracks.len()
+ || row_end >= row_tracks.len()
+ {
+ continue;
+ }
+
+ let Some(cell_bounds) = cell_bounds(
+ layout_bounds,
+ column_tracks[column_start].anchor_start,
+ column_tracks[column_end].anchor_end,
+ row_tracks[row_start].anchor_start,
+ row_tracks[row_end].anchor_end,
+ ) else {
+ continue;
+ };
+
+ result.push(CellData {
+ shape,
+ anchor: cell_bounds.nw,
+ width: cell_bounds.width(),
+ height: cell_bounds.height(),
+ align_self: cell.align_self,
+ justify_self: cell.justify_self,
+ });
+ }
+
+ result
+}
+
+fn child_position(
+ child: &Shape,
+ layout_bounds: &Bounds,
+ layout_data: &LayoutData,
+ child_bounds: &Bounds,
+ layout_item: Option,
+ cell: &CellData,
+) -> Point {
+ let hv = layout_bounds.hv(1.0);
+ let vv = layout_bounds.vv(1.0);
+
+ let margin_left = layout_item.map(|i| i.margin_left).unwrap_or(0.0);
+ let margin_top = layout_item.map(|i| i.margin_top).unwrap_or(0.0);
+ let margin_right = layout_item.map(|i| i.margin_right).unwrap_or(0.0);
+ let margin_bottom = layout_item.map(|i| i.margin_bottom).unwrap_or(0.0);
+
+ let vpos = match (cell.align_self, layout_data.align_items) {
+ (Some(AlignSelf::Start), _) => margin_top,
+ (Some(AlignSelf::Center), _) => (cell.height - child_bounds.height()) / 2.0,
+ (Some(AlignSelf::End), _) => margin_bottom + cell.height - child_bounds.height(),
+ (_, AlignItems::Center) => (cell.height - child_bounds.height()) / 2.0,
+ (_, AlignItems::End) => margin_bottom + cell.height - child_bounds.height(),
+ _ => margin_top,
+ };
+
+ let vpos = if child.is_layout_vertical_fill() {
+ margin_top
+ } else {
+ vpos
+ };
+
+ let hpos = match (cell.justify_self, layout_data.justify_items) {
+ (Some(JustifySelf::Start), _) => margin_left,
+ (Some(JustifySelf::Center), _) => (cell.width - child_bounds.width()) / 2.0,
+ (Some(JustifySelf::End), _) => margin_right + cell.width - child_bounds.width(),
+ (_, JustifyItems::Center) => (cell.width - child_bounds.width()) / 2.0,
+ (_, JustifyItems::End) => margin_right + cell.width - child_bounds.width(),
+ _ => margin_left,
+ };
+
+ let hpos = if child.is_layout_horizontal_fill() {
+ margin_left
+ } else {
+ hpos
+ };
+
+ cell.anchor + vv * vpos + hv * hpos
+}
+
+pub fn reflow_grid_layout<'a>(
+ shape: &Shape,
+ layout_data: &LayoutData,
+ grid_data: &GridData,
+ shapes: &'a HashMap,
+ bounds: &mut HashMap,
+ structure: &HashMap>,
+) -> VecDeque {
+ let mut result = VecDeque::new();
+ let layout_bounds = bounds.find(shape);
+ let children = modified_children_ids(shape, structure.get(&shape.id));
+
+ let column_tracks = calculate_tracks(
+ true,
+ shape,
+ layout_data,
+ grid_data,
+ &layout_bounds,
+ &grid_data.cells,
+ shapes,
+ bounds,
+ );
+
+ let row_tracks = calculate_tracks(
+ false,
+ shape,
+ layout_data,
+ grid_data,
+ &layout_bounds,
+ &grid_data.cells,
+ shapes,
+ bounds,
+ );
+
+ let cells = create_cell_data(
+ &layout_bounds,
+ &children,
+ shapes,
+ &grid_data.cells,
+ &column_tracks,
+ &row_tracks,
+ );
+
+ for cell in cells.iter() {
+ let child = cell.shape;
+ let child_bounds = bounds.find(child);
+
+ let mut new_width = child_bounds.width();
+ if child.is_layout_horizontal_fill() {
+ let margin_left = child.layout_item.map(|i| i.margin_left).unwrap_or(0.0);
+ new_width = cell.width - margin_left;
+ let min_width = child.layout_item.and_then(|i| i.min_w).unwrap_or(MIN_SIZE);
+ let max_width = child.layout_item.and_then(|i| i.max_w).unwrap_or(MAX_SIZE);
+ new_width = new_width.clamp(min_width, max_width);
+ }
+
+ let mut new_height = child_bounds.height();
+ if child.is_layout_vertical_fill() {
+ let margin_top = child.layout_item.map(|i| i.margin_top).unwrap_or(0.0);
+ new_height = cell.height - margin_top;
+ let min_height = child.layout_item.and_then(|i| i.min_h).unwrap_or(MIN_SIZE);
+ let max_height = child.layout_item.and_then(|i| i.max_h).unwrap_or(MAX_SIZE);
+ new_height = new_height.clamp(min_height, max_height);
+ }
+
+ let mut transform = Matrix::default();
+
+ if (new_width - child_bounds.width()).abs() > MIN_SIZE
+ || (new_height - child_bounds.height()).abs() > MIN_SIZE
+ {
+ transform.post_concat(&math::resize_matrix(
+ &layout_bounds,
+ &child_bounds,
+ new_width,
+ new_height,
+ ));
+ }
+
+ let position = child_position(
+ &child,
+ &layout_bounds,
+ &layout_data,
+ &child_bounds,
+ child.layout_item,
+ cell,
+ );
+
+ let delta_v = Vector::new_points(&child_bounds.nw, &position);
+
+ if delta_v.x.abs() > MIN_SIZE || delta_v.y.abs() > MIN_SIZE {
+ transform.post_concat(&Matrix::translate(delta_v));
+ }
+
+ result.push_back(Modifier::transform(child.id, transform));
+ }
+
+ if shape.is_layout_horizontal_auto() || shape.is_layout_vertical_auto() {
+ let width = layout_bounds.width();
+ let height = layout_bounds.height();
+
+ let mut scale_width = 1.0;
+ let mut scale_height = 1.0;
+
+ if shape.is_layout_horizontal_auto() {
+ let auto_width = column_tracks.iter().map(|t| t.size).sum::()
+ + layout_data.padding_left
+ + layout_data.padding_right
+ + (column_tracks.len() - 1) as f32 * layout_data.column_gap;
+ scale_width = auto_width / width;
+ }
+
+ if shape.is_layout_vertical_auto() {
+ let auto_height = row_tracks.iter().map(|t| t.size).sum::()
+ + layout_data.padding_top
+ + layout_data.padding_bottom
+ + (row_tracks.len() - 1) as f32 * layout_data.row_gap;
+ scale_height = auto_height / height;
+ }
+
+ let parent_transform = layout_bounds
+ .transform_matrix()
+ .unwrap_or(Matrix::default());
+
+ let parent_transform_inv = &parent_transform.invert().unwrap();
+ let origin = parent_transform_inv.map_point(layout_bounds.nw);
+
+ let mut scale = Matrix::scale((scale_width, scale_height));
+ scale.post_translate(origin);
+ scale.post_concat(&parent_transform);
+ scale.pre_translate(-origin);
+ scale.pre_concat(&parent_transform_inv);
+
+ let layout_bounds_after = layout_bounds.transform(&scale);
+ result.push_back(Modifier::parent(shape.id, scale));
+ bounds.insert(shape.id, layout_bounds_after);
+ }
+
+ result
}
diff --git a/render-wasm/src/shapes/paths.rs b/render-wasm/src/shapes/paths.rs
index 5f0741842c..a09ec3c545 100644
--- a/render-wasm/src/shapes/paths.rs
+++ b/render-wasm/src/shapes/paths.rs
@@ -76,18 +76,6 @@ pub struct Path {
open: bool,
}
-fn starts_and_ends_at_same_point(path: &skia::Path) -> bool {
- if path.count_points() < 2 {
- return false; // A path with fewer than 2 points cannot be closed
- }
-
- let start_point = path.get_point(0); // First point of the path
- let end_point = path.get_point(path.count_points() - 1); // Last point of the path
-
- // Compare the start and end points
- start_point == end_point
-}
-
impl Default for Path {
fn default() -> Self {
Path::try_from(Vec::new()).unwrap()
@@ -105,29 +93,36 @@ impl TryFrom> for Path {
.collect::, String>>()?;
let mut skia_path = skia::Path::new();
+ let mut start = None;
+
for segment in segments.iter() {
- match *segment {
+ let destination = match *segment {
Segment::MoveTo(xy) => {
+ start = Some(xy);
skia_path.move_to(xy);
+ None
}
Segment::LineTo(xy) => {
skia_path.line_to(xy);
+ Some(xy)
}
Segment::CurveTo((c1, c2, xy)) => {
skia_path.cubic_to(c1, c2, xy);
+ Some(xy)
}
Segment::Close => {
skia_path.close();
open = false;
+ None
+ }
+ };
+ if let (Some(start), Some(destination)) = (start, destination) {
+ if destination == start {
+ skia_path.close();
+ open = false;
}
}
}
-
- if !skia_path.is_last_contour_closed() && starts_and_ends_at_same_point(&skia_path) {
- skia_path.close();
- open = false;
- }
-
Ok(Path {
segments,
skia_path,
diff --git a/render-wasm/src/shapes/shadows.rs b/render-wasm/src/shapes/shadows.rs
index 755d8e063c..a8f226c41b 100644
--- a/render-wasm/src/shapes/shadows.rs
+++ b/render-wasm/src/shapes/shadows.rs
@@ -1,4 +1,4 @@
-use skia_safe::{self as skia, image_filters, ImageFilter};
+use skia_safe::{self as skia, image_filters, ImageFilter, Paint};
use super::Color;
@@ -62,81 +62,17 @@ impl Shadow {
self.hidden
}
- pub fn to_paint(&self, scale: f32) -> skia::Paint {
- let mut paint = skia::Paint::default();
-
- let image_filter = match self.style {
- ShadowStyle::Drop => self.drop_shadow_filters(scale),
- ShadowStyle::Inner => self.inner_shadow_filters(scale),
- };
-
- paint.set_image_filter(image_filter);
- paint.set_anti_alias(true);
-
- paint
- }
-
- fn drop_shadow_filters(&self, scale: f32) -> Option {
- let mut filter = image_filters::drop_shadow_only(
- (self.offset.0 * scale, self.offset.1 * scale),
- (self.blur * scale, self.blur * scale),
- self.color,
- None,
- None,
- None,
- );
-
- if self.spread > 0. {
- filter =
- image_filters::dilate((self.spread * scale, self.spread * scale), filter, None);
- }
-
- filter
- }
-
- fn inner_shadow_filters(&self, scale: f32) -> Option {
- let sigma = self.blur * 0.5;
- let mut filter = skia::image_filters::drop_shadow_only(
- (self.offset.0 * scale, self.offset.1 * scale), // DPR?
- (sigma * scale, sigma * scale),
- skia::Color::BLACK,
- None,
- None,
- None,
- );
-
- filter = skia::image_filters::color_filter(
- skia::color_filters::blend(self.color, skia::BlendMode::SrcOut).unwrap(),
- filter,
- None,
- );
-
- if self.spread > 0. {
- filter = skia::image_filters::dilate(
- (self.spread * scale, self.spread * scale),
- filter,
- None,
- );
- }
-
- filter = skia::image_filters::blend(skia::BlendMode::SrcIn, None, filter, None);
-
- filter
- }
-
- // New methods for DropShadow
- pub fn get_drop_shadow_paint(&self) -> skia::Paint {
- let mut paint = skia::Paint::default();
-
+ pub fn get_drop_shadow_paint(&self, antialias: bool) -> Paint {
+ let mut paint = Paint::default();
let image_filter = self.get_drop_shadow_filter();
paint.set_image_filter(image_filter);
- paint.set_anti_alias(true);
+ paint.set_anti_alias(antialias);
paint
}
- fn get_drop_shadow_filter(&self) -> Option {
+ pub fn get_drop_shadow_filter(&self) -> Option {
let mut filter = image_filters::drop_shadow_only(
(self.offset.0, self.offset.1),
(self.blur, self.blur),
@@ -152,4 +88,41 @@ impl Shadow {
filter
}
+
+ pub fn get_inner_shadow_paint(&self, antialias: bool) -> Paint {
+ let mut paint = Paint::default();
+
+ let image_filter = self.get_inner_shadow_filter();
+
+ paint.set_image_filter(image_filter);
+ paint.set_anti_alias(antialias);
+
+ paint
+ }
+
+ pub fn get_inner_shadow_filter(&self) -> Option {
+ let sigma = self.blur * 0.5;
+ let mut filter = skia::image_filters::drop_shadow_only(
+ (self.offset.0, self.offset.1), // DPR?
+ (sigma, sigma),
+ skia::Color::WHITE,
+ None,
+ None,
+ None,
+ );
+
+ filter = skia::image_filters::color_filter(
+ skia::color_filters::blend(self.color, skia::BlendMode::SrcOut).unwrap(),
+ filter,
+ None,
+ );
+
+ if self.spread > 0. {
+ filter = skia::image_filters::dilate((self.spread, self.spread), filter, None);
+ }
+
+ filter = skia::image_filters::blend(skia::BlendMode::SrcIn, None, filter, None);
+
+ filter
+ }
}
diff --git a/render-wasm/src/shapes/strokes.rs b/render-wasm/src/shapes/strokes.rs
index d68b95bbdb..c1372d224c 100644
--- a/render-wasm/src/shapes/strokes.rs
+++ b/render-wasm/src/shapes/strokes.rs
@@ -116,8 +116,8 @@ impl Stroke {
pub fn delta(&self) -> f32 {
match self.kind {
StrokeKind::InnerStroke => 0.,
- StrokeKind::CenterStroke => self.width / 2.,
- StrokeKind::OuterStroke => self.width,
+ StrokeKind::CenterStroke => self.width,
+ StrokeKind::OuterStroke => self.width * 2.,
}
}
@@ -160,8 +160,9 @@ impl Stroke {
rect: &Rect,
svg_attrs: &HashMap,
scale: f32,
+ antialias: bool,
) -> skia::Paint {
- let mut paint = self.fill.to_paint(rect);
+ let mut paint = self.fill.to_paint(rect, antialias);
paint.set_style(skia::PaintStyle::Stroke);
let width = match self.kind {
@@ -171,7 +172,7 @@ impl Stroke {
};
paint.set_stroke_width(width);
- paint.set_anti_alias(true);
+ paint.set_anti_alias(antialias);
if let Some("round") = svg_attrs.get("stroke-linecap").map(String::as_str) {
paint.set_stroke_cap(skia::paint::Cap::Round);
@@ -225,18 +226,19 @@ impl Stroke {
rect: &Rect,
svg_attrs: &HashMap,
scale: f32,
+ antialias: bool,
) -> skia::Paint {
- let mut paint = self.to_paint(rect, svg_attrs, scale);
+ let mut paint = self.to_paint(rect, svg_attrs, scale, antialias);
match self.render_kind(is_open) {
StrokeKind::InnerStroke => {
paint.set_stroke_width(2. * paint.stroke_width());
- paint
}
- StrokeKind::CenterStroke => paint,
+ StrokeKind::CenterStroke => {}
StrokeKind::OuterStroke => {
paint.set_stroke_width(2. * paint.stroke_width());
- paint
}
}
+
+ paint
}
}
diff --git a/render-wasm/src/shapes/text.rs b/render-wasm/src/shapes/text.rs
index 47cc123903..0e338f62ef 100644
--- a/render-wasm/src/shapes/text.rs
+++ b/render-wasm/src/shapes/text.rs
@@ -1,6 +1,6 @@
use crate::{
math::Rect,
- render::{DEFAULT_EMOJI_FONT, DEFAULT_FONT},
+ render::{default_font, DEFAULT_EMOJI_FONT},
};
use skia_safe::{
self as skia,
@@ -8,6 +8,8 @@ use skia_safe::{
};
use super::FontFamily;
+use crate::utils::uuid_from_u32;
+use crate::Uuid;
#[derive(Debug, PartialEq, Clone)]
pub struct TextContent {
@@ -26,60 +28,52 @@ impl TextContent {
self.bounds = Rect::from_xywh(x, y, w, h);
}
+ #[allow(dead_code)]
pub fn width(&self) -> f32 {
self.bounds.width()
}
+ #[allow(dead_code)]
pub fn x(&self) -> f32 {
self.bounds.x()
}
+ #[allow(dead_code)]
pub fn y(&self) -> f32 {
self.bounds.y()
}
- pub fn add_paragraph(&mut self) {
- let p = Paragraph::default();
- self.paragraphs.push(p);
- }
-
- pub fn add_leaf(
- &mut self,
- text: String,
- font_family: FontFamily,
- font_size: f32,
- ) -> Result<(), String> {
- let paragraph = self
- .paragraphs
- .last_mut()
- .ok_or("No paragraph to add text leaf to")?;
-
- paragraph.add_leaf(TextLeaf::new(text, font_family, font_size));
-
- Ok(())
+ pub fn add_paragraph(&mut self, paragraph: Paragraph) {
+ self.paragraphs.push(paragraph);
}
pub fn to_paragraphs(&self, fonts: &FontCollection) -> Vec {
- let mut paragraph_style = ParagraphStyle::default();
- // TODO: read text direction, align, etc. from the shape
- paragraph_style.set_text_direction(skia::textlayout::TextDirection::LTR);
-
self.paragraphs
.iter()
.map(|p| {
+ let paragraph_style = p.paragraph_to_style();
let mut builder = ParagraphBuilder::new(¶graph_style, fonts);
-
for leaf in &p.children {
- let text_style = leaf.to_style();
+ let text_style = leaf.to_style(&p);
+ let text = leaf.apply_text_transform(p.text_transform);
+
builder.push_style(&text_style);
- builder.add_text(&leaf.text);
+ builder.add_text(&text);
builder.pop();
}
-
builder.build()
})
.collect()
}
+
+ pub fn to_skia_paragraphs(&self, fonts: &FontCollection) -> Vec {
+ let mut paragraphs = Vec::new();
+ for mut skia_paragraph in self.to_paragraphs(fonts) {
+ skia_paragraph.layout(self.width());
+ paragraphs.push(skia_paragraph);
+ }
+ paragraphs
+ }
}
impl Default for TextContent {
@@ -93,19 +87,90 @@ impl Default for TextContent {
#[derive(Debug, PartialEq, Clone)]
pub struct Paragraph {
+ text_align: u8,
+ text_decoration: u8,
+ text_direction: u8,
+ text_transform: u8,
+ line_height: f32,
+ letter_spacing: f32,
+ typography_ref_file: Uuid,
+ typography_ref_id: Uuid,
children: Vec,
}
impl Default for Paragraph {
fn default() -> Self {
- Self { children: vec![] }
+ Self {
+ text_align: 0,
+ text_decoration: 0,
+ text_direction: 0,
+ text_transform: 0,
+ line_height: 1.0,
+ letter_spacing: 0.0,
+ typography_ref_file: Uuid::nil(),
+ typography_ref_id: Uuid::nil(),
+ children: vec![],
+ }
}
}
impl Paragraph {
+ pub fn new(
+ text_align: u8,
+ text_decoration: u8,
+ text_direction: u8,
+ text_transform: u8,
+ line_height: f32,
+ letter_spacing: f32,
+ typography_ref_file: Uuid,
+ typography_ref_id: Uuid,
+ children: Vec,
+ ) -> Self {
+ Self {
+ text_align,
+ text_decoration,
+ text_direction,
+ text_transform,
+ line_height,
+ letter_spacing,
+ typography_ref_file,
+ typography_ref_id,
+ children,
+ }
+ }
+
+ #[allow(dead_code)]
+ fn set_children(&mut self, children: Vec) {
+ self.children = children;
+ }
+
+ #[allow(dead_code)]
+ pub fn get_children(&self) -> &Vec {
+ &self.children
+ }
+
+ #[allow(dead_code)]
fn add_leaf(&mut self, leaf: TextLeaf) {
self.children.push(leaf);
}
+
+ pub fn paragraph_to_style(&self) -> ParagraphStyle {
+ let mut style = ParagraphStyle::default();
+ style.set_text_align(match self.text_align {
+ 0 => skia::textlayout::TextAlign::Left,
+ 1 => skia::textlayout::TextAlign::Center,
+ 2 => skia::textlayout::TextAlign::Right,
+ 3 => skia::textlayout::TextAlign::Justify,
+ _ => skia::textlayout::TextAlign::Left,
+ });
+ style.set_height(self.line_height);
+ style.set_text_direction(match self.text_direction {
+ 0 => skia::textlayout::TextDirection::LTR,
+ 1 => skia::textlayout::TextDirection::RTL,
+ _ => skia::textlayout::TextDirection::LTR,
+ });
+ style
+ }
}
#[derive(Debug, PartialEq, Clone)]
@@ -113,30 +178,250 @@ pub struct TextLeaf {
text: String,
font_family: FontFamily,
font_size: f32,
+ font_style: u8,
+ font_weight: i32,
+ font_variant_id: Uuid,
}
impl TextLeaf {
- pub fn new(text: String, font_family: FontFamily, font_size: f32) -> Self {
+ pub fn new(
+ text: String,
+ font_family: FontFamily,
+ font_size: f32,
+ font_style: u8,
+ font_weight: i32,
+ font_variant_id: Uuid,
+ ) -> Self {
Self {
text,
font_family,
font_size,
+ font_style,
+ font_weight,
+ font_variant_id,
}
}
- pub fn to_style(&self) -> skia::textlayout::TextStyle {
+ pub fn to_style(&self, paragraph: &Paragraph) -> skia::textlayout::TextStyle {
let mut style = skia::textlayout::TextStyle::default();
style.set_color(skia::Color::BLACK);
style.set_font_size(self.font_size);
+ style.set_letter_spacing(paragraph.letter_spacing);
+ style.set_height(paragraph.line_height);
+ style.set_height_override(true);
+ style.set_decoration_type(match paragraph.text_decoration {
+ 0 => skia::textlayout::TextDecoration::NO_DECORATION,
+ 1 => skia::textlayout::TextDecoration::UNDERLINE,
+ 2 => skia::textlayout::TextDecoration::LINE_THROUGH,
+ 3 => skia::textlayout::TextDecoration::OVERLINE,
+ _ => skia::textlayout::TextDecoration::NO_DECORATION,
+ });
style.set_font_families(&[
self.serialized_font_family(),
- DEFAULT_FONT.to_string(),
+ default_font(),
DEFAULT_EMOJI_FONT.to_string(),
]);
+
style
}
fn serialized_font_family(&self) -> String {
format!("{}", self.font_family)
}
+
+ pub fn apply_text_transform(&self, transform: u8) -> String {
+ match transform {
+ 1 => self.text.to_uppercase(),
+ 2 => self.text.to_lowercase(),
+ 3 => self
+ .text
+ .split_whitespace()
+ .map(|word| {
+ let mut chars = word.chars();
+ match chars.next() {
+ Some(first) => first.to_uppercase().collect::() + chars.as_str(),
+ None => String::new(),
+ }
+ })
+ .collect::>()
+ .join(" "),
+ _ => self.text.clone(),
+ }
+ }
+}
+
+pub const RAW_PARAGRAPH_DATA_SIZE: usize = 48;
+pub const RAW_LEAF_DATA_SIZE: usize = 52;
+
+#[repr(C)]
+#[derive(Debug)]
+pub struct RawTextLeafData {
+ font_style: u8,
+ font_size: f32,
+ font_weight: i32,
+ font_id: [u32; 4],
+ font_family: [u8; 4],
+ font_variant_id: [u32; 4],
+ text_length: u32,
+}
+
+#[repr(C)]
+#[derive(Debug)]
+pub struct RawParagraphData {
+ text_align: u8,
+ text_transform: u8,
+ text_decoration: u8,
+ text_direction: u8,
+ line_height: f32,
+ letter_spacing: f32,
+ typography_ref_file: [u32; 4],
+ typography_ref_id: [u32; 4],
+}
+
+impl From<[u8; RAW_PARAGRAPH_DATA_SIZE]> for RawParagraphData {
+ fn from(bytes: [u8; RAW_PARAGRAPH_DATA_SIZE]) -> Self {
+ Self {
+ text_align: bytes[4],
+ text_direction: bytes[5],
+ text_decoration: bytes[6],
+ text_transform: bytes[7],
+ line_height: f32::from_be_bytes([bytes[8], bytes[9], bytes[10], bytes[11]]),
+ letter_spacing: f32::from_be_bytes([bytes[12], bytes[13], bytes[14], bytes[15]]),
+ typography_ref_file: [
+ u32::from_be_bytes([bytes[16], bytes[17], bytes[18], bytes[19]]),
+ u32::from_be_bytes([bytes[20], bytes[21], bytes[22], bytes[23]]),
+ u32::from_be_bytes([bytes[24], bytes[25], bytes[26], bytes[27]]),
+ u32::from_be_bytes([bytes[28], bytes[29], bytes[30], bytes[31]]),
+ ],
+ typography_ref_id: [
+ u32::from_be_bytes([bytes[32], bytes[33], bytes[34], bytes[35]]),
+ u32::from_be_bytes([bytes[36], bytes[37], bytes[38], bytes[39]]),
+ u32::from_be_bytes([bytes[40], bytes[41], bytes[42], bytes[43]]),
+ u32::from_be_bytes([bytes[44], bytes[45], bytes[46], bytes[47]]),
+ ],
+ }
+ }
+}
+
+pub struct RawTextData {
+ pub paragraph: Paragraph,
+}
+
+impl RawTextData {
+ fn leaves_attrs_from_bytes(buffer: &[u8], num_leaves: usize) -> Vec {
+ let mut attrs = Vec::new();
+ for i in 0..num_leaves {
+ let start = i * RAW_LEAF_DATA_SIZE;
+ let end = start + RAW_LEAF_DATA_SIZE;
+ let bytes = &buffer[start..end];
+ let array: [u8; RAW_LEAF_DATA_SIZE] = bytes.try_into().expect("Slice length mismatch");
+ let leaf_attrs = RawTextLeafData::from(array);
+ attrs.push(leaf_attrs);
+ }
+ attrs
+ }
+
+ fn paragraph_attrs_from_bytes(buffer: &[u8]) -> RawParagraphData {
+ let bytes: [u8; RAW_PARAGRAPH_DATA_SIZE] = buffer[..RAW_PARAGRAPH_DATA_SIZE]
+ .try_into()
+ .expect("Slice length mismatch for paragraph attributes");
+ RawParagraphData::from(bytes)
+ }
+
+ fn text_from_bytes(buffer: &[u8], offset: usize, text_length: u32) -> (String, usize) {
+ let text_length = text_length as usize;
+ let text_end = offset + text_length;
+
+ if text_end > buffer.len() {
+ panic!(
+ "Invalid text range: offset={}, text_end={}, buffer_len={}",
+ offset,
+ text_end,
+ buffer.len()
+ );
+ }
+
+ let text_utf8 = buffer[offset..text_end].to_vec();
+ let text = String::from_utf8(text_utf8).expect("Invalid UTF-8 text");
+
+ (text, text_end)
+ }
+}
+
+impl From<[u8; RAW_LEAF_DATA_SIZE]> for RawTextLeafData {
+ fn from(bytes: [u8; RAW_LEAF_DATA_SIZE]) -> Self {
+ Self {
+ font_style: bytes[0],
+ font_size: f32::from_be_bytes([bytes[4], bytes[5], bytes[6], bytes[7]]),
+ font_weight: i32::from_be_bytes([bytes[8], bytes[9], bytes[10], bytes[11]]),
+ font_id: [
+ u32::from_be_bytes([bytes[12], bytes[13], bytes[14], bytes[15]]),
+ u32::from_be_bytes([bytes[16], bytes[17], bytes[18], bytes[19]]),
+ u32::from_be_bytes([bytes[20], bytes[21], bytes[22], bytes[23]]),
+ u32::from_be_bytes([bytes[24], bytes[25], bytes[26], bytes[27]]),
+ ],
+ font_family: [bytes[28], bytes[29], bytes[30], bytes[31]],
+ font_variant_id: [
+ u32::from_be_bytes([bytes[32], bytes[33], bytes[34], bytes[35]]),
+ u32::from_be_bytes([bytes[36], bytes[37], bytes[38], bytes[39]]),
+ u32::from_be_bytes([bytes[40], bytes[41], bytes[42], bytes[43]]),
+ u32::from_be_bytes([bytes[44], bytes[45], bytes[46], bytes[47]]),
+ ],
+ text_length: u32::from_be_bytes([bytes[48], bytes[49], bytes[50], bytes[51]]),
+ }
+ }
+}
+
+impl From<&Vec> for RawTextData {
+ fn from(bytes: &Vec) -> Self {
+ let num_leaves = u32::from_be_bytes([bytes[0], bytes[1], bytes[2], bytes[3]]) as usize;
+
+ let paragraph_attrs =
+ RawTextData::paragraph_attrs_from_bytes(&bytes[..RAW_PARAGRAPH_DATA_SIZE]);
+ let leaves_attrs =
+ RawTextData::leaves_attrs_from_bytes(&bytes[1 + RAW_PARAGRAPH_DATA_SIZE..], num_leaves);
+
+ let metadata_size = 1 + RAW_PARAGRAPH_DATA_SIZE + num_leaves * RAW_LEAF_DATA_SIZE;
+ let text_start = metadata_size;
+ let mut offset = text_start;
+ let mut text_leaves: Vec = Vec::new();
+
+ for attrs in leaves_attrs {
+ let (text, new_offset) = RawTextData::text_from_bytes(bytes, offset, attrs.text_length);
+ offset = new_offset;
+
+ let font_id = uuid_from_u32(attrs.font_id);
+ let font_variant_id = uuid_from_u32(attrs.font_variant_id);
+
+ let font_family =
+ FontFamily::new(font_id, attrs.font_weight as u32, attrs.font_style.into());
+
+ let text_leaf = TextLeaf::new(
+ text,
+ font_family,
+ attrs.font_size,
+ attrs.font_style,
+ attrs.font_weight,
+ font_variant_id,
+ );
+ text_leaves.push(text_leaf);
+ }
+
+ let typography_ref_file = uuid_from_u32(paragraph_attrs.typography_ref_file);
+ let typography_ref_id = uuid_from_u32(paragraph_attrs.typography_ref_id);
+
+ let paragraph = Paragraph::new(
+ paragraph_attrs.text_align,
+ paragraph_attrs.text_decoration,
+ paragraph_attrs.text_direction,
+ paragraph_attrs.text_transform,
+ paragraph_attrs.line_height,
+ paragraph_attrs.letter_spacing,
+ typography_ref_file,
+ typography_ref_id,
+ text_leaves.clone(),
+ );
+
+ Self { paragraph }
+ }
}
diff --git a/render-wasm/src/shapes/transform.rs b/render-wasm/src/shapes/transform.rs
index bbfd8f77d8..7c7be13ec7 100644
--- a/render-wasm/src/shapes/transform.rs
+++ b/render-wasm/src/shapes/transform.rs
@@ -1,8 +1,8 @@
use skia_safe as skia;
-use uuid::Uuid;
use crate::mem::SerializableResult;
use crate::utils::{uuid_from_u32_quartet, uuid_to_u32_quartet};
+use crate::uuid::Uuid;
use skia::Matrix;
#[derive(PartialEq, Debug, Clone)]
@@ -98,15 +98,74 @@ impl SerializableResult for TransformEntry {
}
}
+#[derive(PartialEq, Debug, Clone, Copy)]
+pub enum StructureEntryType {
+ RemoveChild,
+ AddChild,
+}
+
+impl StructureEntryType {
+ pub fn from_u32(value: u32) -> Self {
+ match value {
+ 1 => Self::RemoveChild,
+ 2 => Self::AddChild,
+ _ => unreachable!(),
+ }
+ }
+}
+
+#[derive(PartialEq, Debug, Clone)]
+#[repr(C)]
+pub struct StructureEntry {
+ pub entry_type: StructureEntryType,
+ pub index: u32,
+ pub parent: Uuid,
+ pub id: Uuid,
+}
+
+impl StructureEntry {
+ pub fn new(entry_type: StructureEntryType, index: u32, parent: Uuid, id: Uuid) -> Self {
+ StructureEntry {
+ entry_type,
+ index,
+ parent,
+ id,
+ }
+ }
+
+ pub fn from_bytes(bytes: [u8; 40]) -> Self {
+ let entry_type = StructureEntryType::from_u32(u32::from_le_bytes([
+ bytes[0], bytes[1], bytes[2], bytes[3],
+ ]));
+
+ let index = u32::from_le_bytes([bytes[4], bytes[5], bytes[6], bytes[7]]);
+
+ let parent = uuid_from_u32_quartet(
+ u32::from_le_bytes([bytes[8], bytes[9], bytes[10], bytes[11]]),
+ u32::from_le_bytes([bytes[12], bytes[13], bytes[14], bytes[15]]),
+ u32::from_le_bytes([bytes[16], bytes[17], bytes[18], bytes[19]]),
+ u32::from_le_bytes([bytes[20], bytes[21], bytes[22], bytes[23]]),
+ );
+
+ let id = uuid_from_u32_quartet(
+ u32::from_le_bytes([bytes[24], bytes[25], bytes[26], bytes[27]]),
+ u32::from_le_bytes([bytes[28], bytes[29], bytes[30], bytes[31]]),
+ u32::from_le_bytes([bytes[32], bytes[33], bytes[34], bytes[35]]),
+ u32::from_le_bytes([bytes[36], bytes[37], bytes[38], bytes[39]]),
+ );
+
+ StructureEntry::new(entry_type, index, parent, id)
+ }
+}
+
#[cfg(test)]
mod tests {
use super::*;
- use uuid::uuid;
#[test]
fn test_serialization() {
let entry = TransformEntry::new(
- uuid!("550e8400-e29b-41d4-a716-446655440000"),
+ Uuid::new_v4(),
Matrix::new_all(1.0, 2.0, 3.0, 4.0, 5.0, 6.0, 0.0, 0.0, 1.0),
);
diff --git a/render-wasm/src/state.rs b/render-wasm/src/state.rs
index 2f440ef785..67f9129c17 100644
--- a/render-wasm/src/state.rs
+++ b/render-wasm/src/state.rs
@@ -1,10 +1,11 @@
use std::collections::HashMap;
use skia_safe as skia;
-use uuid::Uuid;
use crate::render::RenderState;
use crate::shapes::Shape;
+use crate::shapes::StructureEntry;
+use crate::uuid::Uuid;
/// This struct holds the state of the Rust application between JS calls.
///
@@ -17,6 +18,7 @@ pub(crate) struct State<'a> {
pub current_shape: Option<&'a mut Shape>,
pub shapes: HashMap,
pub modifiers: HashMap,
+ pub structure: HashMap>,
}
impl<'a> State<'a> {
@@ -27,6 +29,7 @@ impl<'a> State<'a> {
current_shape: None,
shapes: HashMap::with_capacity(capacity),
modifiers: HashMap::new(),
+ structure: HashMap::new(),
}
}
@@ -39,21 +42,25 @@ impl<'a> State<'a> {
}
pub fn start_render_loop(&mut self, timestamp: i32) -> Result<(), String> {
- self.render_state
- .start_render_loop(&mut self.shapes, &self.modifiers, timestamp)?;
+ self.render_state.start_render_loop(
+ &mut self.shapes,
+ &self.modifiers,
+ &self.structure,
+ timestamp,
+ )?;
Ok(())
}
pub fn process_animation_frame(&mut self, timestamp: i32) -> Result<(), String> {
- self.render_state
- .process_animation_frame(&mut self.shapes, &self.modifiers, timestamp)?;
+ self.render_state.process_animation_frame(
+ &mut self.shapes,
+ &self.modifiers,
+ &self.structure,
+ timestamp,
+ )?;
Ok(())
}
- pub fn render_from_cache(&mut self) {
- let _ = self.render_state.render_from_cache();
- }
-
pub fn use_shape(&'a mut self, id: Uuid) {
if !self.shapes.contains_key(&id) {
let new_shape = Shape::new(id);
@@ -63,6 +70,20 @@ impl<'a> State<'a> {
self.current_shape = self.shapes.get_mut(&id);
}
+ pub fn delete_shape(&mut self, id: Uuid) {
+ // We don't really do a self.shapes.remove so that redo/undo keep working
+ if let Some(shape) = self.shapes.get(&id) {
+ let (rsx, rsy, rex, rey) = self.render_state.get_tiles_for_shape(&shape);
+ for x in rsx..=rex {
+ for y in rsy..=rey {
+ let tile = (x, y);
+ self.render_state.surfaces.remove_cached_tile_surface(tile);
+ self.render_state.tiles.remove_shape_at(tile, id);
+ }
+ }
+ }
+ }
+
pub fn current_shape(&mut self) -> Option<&mut Shape> {
self.current_shape.as_deref_mut()
}
@@ -70,4 +91,45 @@ impl<'a> State<'a> {
pub fn set_background_color(&mut self, color: skia::Color) {
self.render_state.set_background_color(color);
}
+
+ pub fn set_selrect_for_current_shape(&mut self, left: f32, top: f32, right: f32, bottom: f32) {
+ match self.current_shape.as_mut() {
+ Some(shape) => {
+ shape.set_selrect(left, top, right, bottom);
+ // We don't need to update the tile for the root shape.
+ if !shape.id.is_nil() {
+ self.render_state.update_tile_for(&shape);
+ }
+ }
+ None => panic!("Invalid current shape"),
+ }
+ }
+
+ pub fn update_tile_for_current_shape(&mut self) {
+ match self.current_shape.as_mut() {
+ Some(shape) => {
+ // We don't need to update the tile for the root shape.
+ // We can also have deleted the selected shape
+ if !shape.id.is_nil() && self.shapes.contains_key(&shape.id) {
+ self.render_state.update_tile_for(&shape);
+ }
+ }
+ None => panic!("Invalid current shape"),
+ }
+ }
+
+ pub fn rebuild_tiles_shallow(&mut self) {
+ self.render_state
+ .rebuild_tiles_shallow(&mut self.shapes, &self.modifiers, &self.structure);
+ }
+
+ pub fn rebuild_tiles(&mut self) {
+ self.render_state
+ .rebuild_tiles(&mut self.shapes, &self.modifiers, &self.structure);
+ }
+
+ pub fn rebuild_modifier_tiles(&mut self) {
+ self.render_state
+ .rebuild_modifier_tiles(&mut self.shapes, &self.modifiers);
+ }
}
diff --git a/render-wasm/src/utils.rs b/render-wasm/src/utils.rs
index ae5ff986c2..3b51efba02 100644
--- a/render-wasm/src/utils.rs
+++ b/render-wasm/src/utils.rs
@@ -1,4 +1,4 @@
-use uuid::Uuid;
+use crate::uuid::Uuid;
pub fn uuid_from_u32_quartet(a: u32, b: u32, c: u32, d: u32) -> Uuid {
let hi: u64 = ((a as u64) << 32) | b as u64;
@@ -14,3 +14,7 @@ pub fn uuid_to_u32_quartet(id: &Uuid) -> (u32, u32, u32, u32) {
let lolo32 = lo as u32;
(hihi32, hilo32, lohi32, lolo32)
}
+
+pub fn uuid_from_u32(id: [u32; 4]) -> Uuid {
+ uuid_from_u32_quartet(id[0], id[1], id[2], id[3])
+}
diff --git a/render-wasm/src/uuid.rs b/render-wasm/src/uuid.rs
new file mode 100644
index 0000000000..7c2d64ec09
--- /dev/null
+++ b/render-wasm/src/uuid.rs
@@ -0,0 +1,80 @@
+use crate::mem::SerializableResult;
+use crate::utils::uuid_from_u32_quartet;
+use crate::utils::uuid_to_u32_quartet;
+use std::fmt;
+use std::ops::{Deref, DerefMut};
+use uuid::Uuid as ExternalUuid;
+
+#[derive(Debug, Clone, Copy, PartialEq, Eq, Hash)]
+pub struct Uuid(ExternalUuid);
+
+impl Deref for Uuid {
+ type Target = ExternalUuid;
+
+ fn deref(&self) -> &Self::Target {
+ &self.0
+ }
+}
+
+impl DerefMut for Uuid {
+ fn deref_mut(&mut self) -> &mut Self::Target {
+ &mut self.0
+ }
+}
+
+impl Uuid {
+ pub fn nil() -> Self {
+ Self(ExternalUuid::nil())
+ }
+
+ pub fn from_u64_pair(high: u64, low: u64) -> Self {
+ Self(ExternalUuid::from_u64_pair(high, low))
+ }
+
+ #[cfg(test)]
+ pub fn new_v4() -> Self {
+ Self(ExternalUuid::new_v4())
+ }
+}
+
+impl From for Uuid {
+ fn from(uuid: ExternalUuid) -> Self {
+ Self(uuid)
+ }
+}
+
+impl fmt::Display for Uuid {
+ fn fmt(&self, f: &mut fmt::Formatter) -> fmt::Result {
+ write!(f, "{}", self.0)
+ }
+}
+
+impl SerializableResult for Uuid {
+ type BytesType = [u8; 16];
+
+ fn from_bytes(bytes: Self::BytesType) -> Self {
+ Self(*uuid_from_u32_quartet(
+ u32::from_le_bytes([bytes[0], bytes[1], bytes[2], bytes[3]]),
+ u32::from_le_bytes([bytes[4], bytes[5], bytes[6], bytes[7]]),
+ u32::from_le_bytes([bytes[8], bytes[9], bytes[10], bytes[11]]),
+ u32::from_le_bytes([bytes[12], bytes[13], bytes[14], bytes[15]]),
+ ))
+ }
+
+ fn as_bytes(&self) -> Self::BytesType {
+ let mut result: Self::BytesType = [0; 16];
+ let (a, b, c, d) = uuid_to_u32_quartet(&self);
+ result[0..4].clone_from_slice(&a.to_le_bytes());
+ result[4..8].clone_from_slice(&b.to_le_bytes());
+ result[8..12].clone_from_slice(&c.to_le_bytes());
+ result[12..16].clone_from_slice(&d.to_le_bytes());
+
+ result
+ }
+
+ // The generic trait doesn't know the size of the array. This is why the
+ // clone needs to be here even if it could be generic.
+ fn clone_to_slice(&self, slice: &mut [u8]) {
+ slice.clone_from_slice(&self.as_bytes());
+ }
+}
diff --git a/render-wasm/src/view.rs b/render-wasm/src/view.rs
index 1c23511521..eeb7aa858b 100644
--- a/render-wasm/src/view.rs
+++ b/render-wasm/src/view.rs
@@ -45,23 +45,14 @@ impl Viewbox {
);
}
- pub fn set_zoom(&mut self, zoom: f32) {
- self.zoom = zoom;
- self.area
- .set_wh(self.width / self.zoom, self.height / self.zoom);
- }
-
- pub fn set_pan_xy(&mut self, pan_x: f32, pan_y: f32) {
- self.pan_x = pan_x;
- self.pan_y = pan_y;
- self.area.left = -pan_x;
- self.area.top = -pan_y;
- }
-
pub fn set_wh(&mut self, width: f32, height: f32) {
self.width = width;
self.height = height;
self.area
.set_wh(self.width / self.zoom, self.height / self.zoom);
}
+
+ pub fn zoom(&self) -> f32 {
+ self.zoom
+ }
}
diff --git a/render-wasm/src/wapi.rs b/render-wasm/src/wapi.rs
new file mode 100644
index 0000000000..92e03d82cf
--- /dev/null
+++ b/render-wasm/src/wapi.rs
@@ -0,0 +1,38 @@
+#[macro_export]
+macro_rules! request_animation_frame {
+ () => {{
+ #[cfg(target_arch = "wasm32")]
+ unsafe extern "C" {
+ pub fn wapi_requestAnimationFrame() -> i32;
+ }
+
+ #[cfg(target_arch = "wasm32")]
+ let result = unsafe { wapi_requestAnimationFrame() };
+ #[cfg(not(target_arch = "wasm32"))]
+ let result = 0;
+
+ result
+ }};
+}
+
+#[macro_export]
+macro_rules! cancel_animation_frame {
+ ($frame_id:expr) => {
+ #[cfg(target_arch = "wasm32")]
+ unsafe extern "C" {
+ pub fn wapi_cancelAnimationFrame(frame_id: i32);
+ }
+
+ {
+ #[cfg(target_arch = "wasm32")]
+ unsafe {
+ wapi_cancelAnimationFrame($frame_id)
+ };
+ #[cfg(not(target_arch = "wasm32"))]
+ let _ = $frame_id;
+ }
+ };
+}
+
+pub use cancel_animation_frame;
+pub use request_animation_frame;
diff --git a/render-wasm/src/wasm.rs b/render-wasm/src/wasm.rs
index 31ae8a7c1d..7d45923d91 100644
--- a/render-wasm/src/wasm.rs
+++ b/render-wasm/src/wasm.rs
@@ -1,2 +1,4 @@
+pub mod fills;
pub mod fonts;
+pub mod strokes;
pub mod text;
diff --git a/render-wasm/src/wasm/fills.rs b/render-wasm/src/wasm/fills.rs
new file mode 100644
index 0000000000..a6c47fdf1c
--- /dev/null
+++ b/render-wasm/src/wasm/fills.rs
@@ -0,0 +1,60 @@
+use skia_safe as skia;
+
+use crate::mem;
+use crate::shapes;
+use crate::utils::uuid_from_u32_quartet;
+use crate::with_current_shape;
+use crate::STATE;
+
+#[no_mangle]
+pub extern "C" fn add_shape_solid_fill(raw_color: u32) {
+ with_current_shape!(state, |shape: &mut Shape| {
+ let color = skia::Color::new(raw_color);
+ shape.add_fill(shapes::Fill::Solid(color));
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn add_shape_linear_fill() {
+ with_current_shape!(state, |shape: &mut Shape| {
+ let bytes = mem::bytes();
+ let gradient = shapes::Gradient::try_from(&bytes[..]).expect("Invalid gradient data");
+ shape.add_fill(shapes::Fill::LinearGradient(gradient));
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn add_shape_radial_fill() {
+ with_current_shape!(state, |shape: &mut Shape| {
+ let bytes = mem::bytes();
+ let gradient = shapes::Gradient::try_from(&bytes[..]).expect("Invalid gradient data");
+ shape.add_fill(shapes::Fill::RadialGradient(gradient));
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn add_shape_image_fill(
+ a: u32,
+ b: u32,
+ c: u32,
+ d: u32,
+ alpha: f32,
+ width: i32,
+ height: i32,
+) {
+ with_current_shape!(state, |shape: &mut Shape| {
+ let id = uuid_from_u32_quartet(a, b, c, d);
+ shape.add_fill(shapes::Fill::new_image_fill(
+ id,
+ (alpha * 0xff as f32).floor() as u8,
+ (width, height),
+ ));
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn clear_shape_fills() {
+ with_current_shape!(state, |shape: &mut Shape| {
+ shape.clear_fills();
+ });
+}
diff --git a/render-wasm/src/wasm/strokes.rs b/render-wasm/src/wasm/strokes.rs
new file mode 100644
index 0000000000..5aea834cfb
--- /dev/null
+++ b/render-wasm/src/wasm/strokes.rs
@@ -0,0 +1,97 @@
+use skia_safe as skia;
+
+use crate::mem;
+use crate::shapes;
+use crate::utils::uuid_from_u32_quartet;
+use crate::with_current_shape;
+use crate::STATE;
+
+#[no_mangle]
+pub extern "C" fn add_shape_center_stroke(width: f32, style: u8, cap_start: u8, cap_end: u8) {
+ with_current_shape!(state, |shape: &mut Shape| {
+ shape.add_stroke(shapes::Stroke::new_center_stroke(
+ width, style, cap_start, cap_end,
+ ));
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn add_shape_inner_stroke(width: f32, style: u8, cap_start: u8, cap_end: u8) {
+ with_current_shape!(state, |shape: &mut Shape| {
+ shape.add_stroke(shapes::Stroke::new_inner_stroke(
+ width, style, cap_start, cap_end,
+ ));
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn add_shape_outer_stroke(width: f32, style: u8, cap_start: u8, cap_end: u8) {
+ with_current_shape!(state, |shape: &mut Shape| {
+ shape.add_stroke(shapes::Stroke::new_outer_stroke(
+ width, style, cap_start, cap_end,
+ ));
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn add_shape_stroke_solid_fill(raw_color: u32) {
+ with_current_shape!(state, |shape: &mut Shape| {
+ let color = skia::Color::new(raw_color);
+ shape
+ .set_stroke_fill(shapes::Fill::Solid(color))
+ .expect("could not add stroke solid fill");
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn add_shape_stroke_linear_fill() {
+ with_current_shape!(state, |shape: &mut Shape| {
+ let bytes = mem::bytes();
+ let gradient = shapes::Gradient::try_from(&bytes[..]).expect("Invalid gradient data");
+
+ shape
+ .set_stroke_fill(shapes::Fill::LinearGradient(gradient))
+ .expect("could not add stroke linear gradient fill");
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn add_shape_stroke_radial_fill() {
+ with_current_shape!(state, |shape: &mut Shape| {
+ let bytes = mem::bytes();
+ let gradient = shapes::Gradient::try_from(&bytes[..]).expect("Invalid gradient data");
+
+ shape
+ .set_stroke_fill(shapes::Fill::RadialGradient(gradient))
+ .expect("could not add stroke radial gradient fill");
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn add_shape_image_stroke(
+ a: u32,
+ b: u32,
+ c: u32,
+ d: u32,
+ alpha: f32,
+ width: i32,
+ height: i32,
+) {
+ with_current_shape!(state, |shape: &mut Shape| {
+ let id = uuid_from_u32_quartet(a, b, c, d);
+ shape
+ .set_stroke_fill(shapes::Fill::new_image_fill(
+ id,
+ (alpha * 0xff as f32).floor() as u8,
+ (width, height),
+ ))
+ .expect("could not add stroke image fill");
+ });
+}
+
+#[no_mangle]
+pub extern "C" fn clear_shape_strokes() {
+ with_current_shape!(state, |shape: &mut Shape| {
+ shape.clear_strokes();
+ });
+}
diff --git a/render-wasm/src/wasm/text.rs b/render-wasm/src/wasm/text.rs
index 8ab9062ea0..1fb3fd4018 100644
--- a/render-wasm/src/wasm/text.rs
+++ b/render-wasm/src/wasm/text.rs
@@ -1,6 +1,5 @@
use crate::mem;
-use crate::shapes::FontFamily;
-use crate::utils::uuid_from_u32_quartet;
+use crate::shapes::RawTextData;
use crate::with_current_shape;
use crate::STATE;
@@ -12,37 +11,14 @@ pub extern "C" fn clear_shape_text() {
}
#[no_mangle]
-pub extern "C" fn add_text_paragraph() {
- with_current_shape!(state, |shape: &mut Shape| {
- let res = shape.add_text_paragraph();
- if let Err(err) = res {
- eprintln!("{}", err);
- }
- });
-}
-
-#[no_mangle]
-pub extern "C" fn add_text_leaf(
- a: u32,
- b: u32,
- c: u32,
- d: u32,
- weight: u32,
- style: u8,
- font_size: f32,
-) {
- let font_id = uuid_from_u32_quartet(a, b, c, d);
- let font_family = FontFamily::new(font_id, weight, style.into());
+pub extern "C" fn set_shape_text_content() {
let bytes = mem::bytes();
-
- let text = unsafe {
- String::from_utf8_unchecked(bytes) // TODO: handle this error
- };
-
with_current_shape!(state, |shape: &mut Shape| {
- let res = shape.add_text_leaf(text, font_family, font_size);
- if let Err(err) = res {
- eprintln!("{}", err);
- }
+ let raw_text_data = RawTextData::from(&bytes);
+ shape
+ .add_paragraph(raw_text_data.paragraph)
+ .expect("Failed to add paragraph");
});
+
+ mem::free_bytes();
}
diff --git a/render-wasm/test b/render-wasm/test
index 752f25877e..90009283fc 100755
--- a/render-wasm/test
+++ b/render-wasm/test
@@ -1,8 +1,17 @@
#!/usr/bin/env bash
+set -x
+
_SCRIPT_DIR=$(dirname $0);
-
-export SKIA_BINARIES_URL="https://github.com/rust-skia/skia-binaries/releases/download/0.80.0/skia-binaries-9e7d2684a17084095aef-x86_64-unknown-linux-gnu-egl-gl-svg-textlayout-vulkan-wayland-webpd-webpe-x11.tar.gz"
-
pushd $_SCRIPT_DIR;
+
+. ./_build_env
+
+export SKIA_BINARIES_URL=${SKIA_BINARIES_URL:-"https://github.com/penpot/skia-binaries/releases/download/0.81.0-3/skia-binaries-24dee32a277b6c7b5357-x86_64-unknown-linux-gnu-gl-svg-textlayout-binary-cache.tar.gz"}
+export CARGO_BUILD_TARGET=${CARGO_BUILD_TARGET:-"x86_64-unknown-linux-gnu"};
+
cargo test --bin render_wasm -- --show-output
+
+# Exit with the same status code as cargo test
+exit $?
+
popd
diff --git a/render-wasm/watch b/render-wasm/watch
index 0b7b12afed..720e0e2e93 100755
--- a/render-wasm/watch
+++ b/render-wasm/watch
@@ -4,7 +4,10 @@ set -x
_SCRIPT_DIR=$(dirname $0);
pushd $_SCRIPT_DIR;
-. ./_build_env
+. ./_build_env
+
+export CARGO_BUILD_TARGET=${CARGO_BUILD_TARGET:-"wasm32-unknown-emscripten"};
+export SKIA_BINARIES_URL=${SKIA_BINARIES_URL:-"https://github.com/penpot/skia-binaries/releases/download/0.81.0-3/skia-binaries-24dee32a277b6c7b5357-wasm32-unknown-emscripten-gl-svg-textlayout-binary-cache.tar.gz"}
pushd $_SCRIPT_DIR;
cargo watch \