3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-11 00:01:40 +02:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #5491 from penpot/niwinz-rumext-update

Browse source 
⚡ Update rumext version
This commit is contained in:
Belén Albeza 2025-01-07 15:04:27 +01:00 • committed by GitHub
commit 2d955a2256
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 118 additions and 104 deletions
Download patch file Download diff file Expand all files Collapse all files

4
frontend/deps.edn
View file

@ -20,8 +20,8 @@
:git/url "https://github.com/funcool/beicon.git"} :git/url "https://github.com/funcool/beicon.git"}
funcool/rumext funcool/rumext
{:git/tag "v2.15" {:git/tag "v2.18"
:git/sha "28783a7" :git/sha "b6e8f45"
:git/url "https://github.com/funcool/rumext.git"} :git/url "https://github.com/funcool/rumext.git"}
instaparse/instaparse {:mvn/version "1.5.0"} instaparse/instaparse {:mvn/version "1.5.0"}

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

@ -52,8 +52,6 @@
(sm/lazy-validator schema:option)) (sm/lazy-validator schema:option))
(mf/defc context-menu* (mf/defc context-menu*
{::mf/props :obj}
[{:keys [show on-close options selectable selected [{:keys [show on-close options selectable selected
top left fixed min-width origin width] top left fixed min-width origin width]
:as props}] :as props}]
@ -90,7 +88,7 @@
(on-close))) (on-close)))
props props
(mf/spread props :on-close on-local-close) (mf/spread-props props {:on-close on-local-close})
ids ids
(mf/with-memo [levels] (mf/with-memo [levels]

14
frontend/src/app/main/ui/components/radio_buttons.cljs
View file

@ -87,10 +87,16 @@
(dom/blur! input)))) (dom/blur! input))))
context-value context-value
(mf/spread props (mf/spread-object props
:on-change on-change' ;; We pass a special metadata for disable
:encode-fn encode-fn ;; key casing transformation in this
:decode-fn decode-fn)] ;; concrete case, because this component
;; uses legacy mode and props are in
;; kebab-case style
^{::mf/transform false}
{:on-change on-change'
:encode-fn encode-fn
:decode-fn decode-fn})]
[:& (mf/provider context) {:value context-value} [:& (mf/provider context) {:value context-value}
[:div {:class (dm/str class " " (stl/css :radio-btn-wrapper)) [:div {:class (dm/str class " " (stl/css :radio-btn-wrapper))

10
frontend/src/app/main/ui/ds/controls/input.cljs
View file

@ -30,11 +30,11 @@
(let [ref (or ref (mf/use-ref)) (let [ref (or ref (mf/use-ref))
type (d/nilv type "text") type (d/nilv type "text")
props (mf/spread-props props props (mf/spread-props props
:class (stl/css-case {:class (stl/css-case
:input true :input true
:input-with-icon (some? icon)) :input-with-icon (some? icon))
:ref ref :ref ref
:type type) :type type})
on-icon-click on-icon-click
(mf/use-fn (mf/use-fn

9
frontend/src/app/main/ui/ds/storybook.cljs
View file

@ -1,4 +1,3 @@
;; This Source Code Form is subject to the terms of the Mozilla Public ;; 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 ;; 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/. ;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
@ -16,9 +15,9 @@
{::mf/props :obj} {::mf/props :obj}
[{:keys [children size style] :rest other}] [{:keys [children size style] :rest other}]
(let [class (stl/css :story-grid) (let [class (stl/css :story-grid)
size (or size 16) size (or size 16)
style (or style {}) style (or style #js {})
style (mf/spread style :--component-grid-size (dm/str size "px")) style (mf/spread-props style {"--component-grid-size" (dm/str size "px")})
props (mf/spread-props other {:class class :style style})] props (mf/spread-props other {:class class :style style})]
[:> "article" props children])) [:> "article" props children]))
@ -41,4 +40,4 @@
[{:keys [children] :rest other}] [{:keys [children] :rest other}]
(let [class (stl/css :story-grid-row) (let [class (stl/css :story-grid-row)
props (mf/spread-props other {:class class})] props (mf/spread-props other {:class class})]
[:> "article" props children])) [:> "article" props children]))

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

@ -29,7 +29,7 @@
[app.main.ui.workspace.plugins] [app.main.ui.workspace.plugins]
[app.main.ui.workspace.sidebar :refer [left-sidebar right-sidebar]] [app.main.ui.workspace.sidebar :refer [left-sidebar right-sidebar]]
[app.main.ui.workspace.sidebar.collapsable-button :refer [collapsed-button]] [app.main.ui.workspace.sidebar.collapsable-button :refer [collapsed-button]]
[app.main.ui.workspace.sidebar.history :refer [history-toolbox]] [app.main.ui.workspace.sidebar.history :refer [history-toolbox*]]
[app.main.ui.workspace.tokens.modals] [app.main.ui.workspace.tokens.modals]
[app.main.ui.workspace.tokens.modals.themes] [app.main.ui.workspace.tokens.modals.themes]
[app.main.ui.workspace.viewport :refer [viewport]] [app.main.ui.workspace.viewport :refer [viewport]]
@ -100,7 +100,7 @@
(when (dbg/enabled? :history-overlay) (when (dbg/enabled? :history-overlay)
[:div {:class (stl/css :history-debug-overlay)} [:div {:class (stl/css :history-debug-overlay)}
[:button {:on-click #(st/emit! dw/reinitialize-undo)} "CLEAR"] [:button {:on-click #(st/emit! dw/reinitialize-undo)} "CLEAR"]
[:& history-toolbox]]) [:> history-toolbox*]])
[:& viewport {:file file [:& viewport {:file file
:wlocal wlocal :wlocal wlocal

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

@ -536,7 +536,7 @@
[{:keys [mdata]}] [{:keys [mdata]}]
(let [{:keys [disable-booleans disable-flatten]} mdata (let [{:keys [disable-booleans disable-flatten]} mdata
shapes (mf/deref refs/selected-objects) shapes (mf/deref refs/selected-objects)
props (mf/spread-props props (mf/props
{:shapes shapes {:shapes shapes
:disable-booleans disable-booleans :disable-booleans disable-booleans
:disable-flatten disable-flatten})] :disable-flatten disable-flatten})]

3
frontend/src/app/main/ui/workspace/right_header.cljs
View file

@ -141,8 +141,7 @@
;; --- Header Component ;; --- Header Component
(mf/defc right-header (mf/defc right-header*
{::mf/wrap-props false}
[{:keys [file layout page-id]}] [{:keys [file layout page-id]}]
(let [file-id (:id file) (let [file-id (:id file)

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

@ -20,16 +20,16 @@
[app.main.ui.hooks.resize :refer [use-resize-hook]] [app.main.ui.hooks.resize :refer [use-resize-hook]]
[app.main.ui.workspace.comments :refer [comments-sidebar*]] [app.main.ui.workspace.comments :refer [comments-sidebar*]]
[app.main.ui.workspace.left-header :refer [left-header]] [app.main.ui.workspace.left-header :refer [left-header]]
[app.main.ui.workspace.right-header :refer [right-header]] [app.main.ui.workspace.right-header :refer [right-header*]]
[app.main.ui.workspace.sidebar.assets :refer [assets-toolbox]] [app.main.ui.workspace.sidebar.assets :refer [assets-toolbox]]
[app.main.ui.workspace.sidebar.debug :refer [debug-panel]] [app.main.ui.workspace.sidebar.debug :refer [debug-panel]]
[app.main.ui.workspace.sidebar.debug-shape-info :refer [debug-shape-info]] [app.main.ui.workspace.sidebar.debug-shape-info :refer [debug-shape-info]]
[app.main.ui.workspace.sidebar.history :refer [history-toolbox]] [app.main.ui.workspace.sidebar.history :refer [history-toolbox*]]
[app.main.ui.workspace.sidebar.layers :refer [layers-toolbox]] [app.main.ui.workspace.sidebar.layers :refer [layers-toolbox]]
[app.main.ui.workspace.sidebar.options :refer [options-toolbox]] [app.main.ui.workspace.sidebar.options :refer [options-toolbox*]]
[app.main.ui.workspace.sidebar.shortcuts :refer [shortcuts-container]] [app.main.ui.workspace.sidebar.shortcuts :refer [shortcuts-container]]
[app.main.ui.workspace.sidebar.sitemap :refer [sitemap]] [app.main.ui.workspace.sidebar.sitemap :refer [sitemap]]
[app.main.ui.workspace.sidebar.versions :refer [versions-toolbox]] [app.main.ui.workspace.sidebar.versions :refer [versions-toolbox*]]
[app.main.ui.workspace.tokens.sidebar :refer [tokens-sidebar-tab]] [app.main.ui.workspace.tokens.sidebar :refer [tokens-sidebar-tab]]
[app.util.debug :as dbg] [app.util.debug :as dbg]
[app.util.i18n :refer [tr]] [app.util.i18n :refer [tr]]
@ -189,82 +189,99 @@
is-history? (contains? layout :document-history) is-history? (contains? layout :document-history)
is-inspect? (= section :inspect) is-inspect? (= section :inspect)
dbg-shape-panel? (dbg/enabled? :shape-panel)
current-section* (mf/use-state :info) current-section* (mf/use-state :info)
current-section (deref current-section*) current-section (deref current-section*)
can-be-expanded? (or (dbg/enabled? :shape-panel) can-be-expanded?
(and (not is-comments?) (or dbg-shape-panel?
(not is-history?) (and (not is-comments?)
is-inspect? (not is-history?)
(= current-section :code))) is-inspect?
(= current-section :code)))
{:keys [on-pointer-down on-lost-pointer-capture on-pointer-move set-size size]} {:keys [on-pointer-down on-lost-pointer-capture on-pointer-move set-size size]}
(use-resize-hook :code 276 276 768 :x true :right) (use-resize-hook :code 276 276 768 :x true :right)
handle-change-section on-change-section
(mf/use-callback (mf/use-fn
(fn [section] (fn [section]
(reset! current-section* section))) (reset! current-section* section)))
on-close-history on-close-history
(mf/use-fn #(st/emit! (dw/remove-layout-flag :document-history))) (mf/use-fn #(st/emit! (dw/remove-layout-flag :document-history)))
handle-expand on-expand
(mf/use-callback (mf/use-fn
(mf/deps size) (mf/deps size)
(fn [] (fn []
(set-size (if (> size 276) 276 768)))) (set-size (if (> size 276) 276 768))))
props props
(mf/spread props (mf/spread-props props
:on-change-section handle-change-section {:on-change-section on-change-section
:on-expand handle-expand) :on-expand on-expand})]
history-tab [:> (mf/provider muc/sidebar) {:value :right}
(mf/html [:aside
[:article {:class (stl/css :history-tab)} {:class (stl/css-case :right-settings-bar true
[:& history-toolbox {}]]) :not-expand (not can-be-expanded?)
:expanded (> size 276))
versions-tab :id "right-sidebar-aside"
(mf/html :data-testid "right-sidebar"
[:article {:class (stl/css :versions-tab)} :data-size (str size)
[:& versions-toolbox {}]])] :style {"--width" (if can-be-expanded? (dm/str size "px") "276px")}}
[:& (mf/provider muc/sidebar) {:value :right}
[:aside {:class (stl/css-case :right-settings-bar true
:not-expand (not can-be-expanded?)
:expanded (> size 276))
:id "right-sidebar-aside"
:data-testid "right-sidebar"
:data-size (str size)
:style #js {"--width" (if can-be-expanded? (dm/str size "px") "276px")}}
(when can-be-expanded? (when can-be-expanded?
[:div {:class (stl/css :resize-area) [:div {:class (stl/css :resize-area)
:on-pointer-down on-pointer-down :on-pointer-down on-pointer-down
:on-lost-pointer-capture on-lost-pointer-capture :on-lost-pointer-capture on-lost-pointer-capture
:on-pointer-move on-pointer-move}]) :on-pointer-move on-pointer-move}])
[:& right-header {:file file :layout layout :page-id page-id}]
[:> right-header*
{:file file
:layout layout
:page-id page-id}]
[:div {:class (stl/css :settings-bar-inside)} [:div {:class (stl/css :settings-bar-inside)}
(cond (cond
(dbg/enabled? :shape-panel) dbg-shape-panel?
[:& debug-shape-info] [:& debug-shape-info]
(true? is-comments?) is-comments?
[:> comments-sidebar* {}] [:> comments-sidebar* {}]
(true? is-history?) is-history?
[:> tab-switcher* (let [history-tab
{:tabs #js [#js {:label (tr "workspace.versions.tab.history") :id "history" :content versions-tab} (mf/html
#js {:label (tr "workspace.versions.tab.actions") :id "actions" :content history-tab}] [:article {:class (stl/css :history-tab)}
:default-selected "history" [:> history-toolbox*]])
:class (stl/css :left-sidebar-tabs)
:action-button-position "end" versions-tab
:action-button (mf/html [:> icon-button* {:variant "ghost" (mf/html
:aria-label (tr "labels.close") [:article {:class (stl/css :versions-tab)}
:on-click on-close-history [:> versions-toolbox*]])
:icon "close"}])}]
button
(mf/html
[:> icon-button* {:variant "ghost"
:aria-label (tr "labels.close")
:on-click on-close-history
:icon "close"}])]
[:> tab-switcher*
{:tabs [{:label (tr "workspace.versions.tab.history")
:id "history"
:content versions-tab}
{:label (tr "workspace.versions.tab.actions")
:id "actions"
:content history-tab}]
:default-selected "history"
:class (stl/css :left-sidebar-tabs)
:action-button-position "end"
:action-button button}])
:else :else
[:> options-toolbox props])]]])) [:> options-toolbox* props])]]]))

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

@ -320,7 +320,7 @@
(when @show-detail? (when @show-detail?
[:& history-entry-details {:entry entry}])])) [:& history-entry-details {:entry entry}])]))
(mf/defc history-toolbox (mf/defc history-toolbox*
[] []
(let [objects (mf/deref refs/workspace-page-objects) (let [objects (mf/deref refs/workspace-page-objects)
{:keys [items index]} (mf/deref workspace-undo) {:keys [items index]} (mf/deref workspace-undo)

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

@ -43,7 +43,7 @@
[{:keys [selected] :as props}] [{:keys [selected] :as props}]
(let [pending-selected (mf/use-var selected) (let [pending-selected (mf/use-var selected)
current-selected (mf/use-state selected) current-selected (mf/use-state selected)
props (mf/spread props :selected @current-selected) props (mf/spread-object props {:selected @current-selected})
set-selected set-selected
(mf/use-memo (mf/use-memo

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

@ -129,9 +129,9 @@
:file-id file-id :file-id file-id
:shared-libs shared-libs}])])) :shared-libs shared-libs}])]))
(mf/defc options-content (mf/defc options-content*
{::mf/memo true {::mf/memo true
::mf/props :obj} ::mf/private true}
[{:keys [selected shapes shapes-with-children page-id file-id on-change-section on-expand]}] [{:keys [selected shapes shapes-with-children page-id file-id on-change-section on-expand]}]
(let [objects (mf/deref refs/workspace-page-objects) (let [objects (mf/deref refs/workspace-page-objects)
permissions (mf/use-ctx ctx/permissions) permissions (mf/use-ctx ctx/permissions)
@ -202,20 +202,19 @@
;; selected-objects-with-children are derefed always but they only ;; selected-objects-with-children are derefed always but they only
;; need on multiple selection in majority of cases ;; need on multiple selection in majority of cases
(mf/defc options-toolbox (mf/defc options-toolbox*
{::mf/memo true {::mf/memo true}
::mf/props :obj}
[{:keys [section selected on-change-section on-expand]}] [{:keys [section selected on-change-section on-expand]}]
(let [page-id (mf/use-ctx ctx/current-page-id) (let [page-id (mf/use-ctx ctx/current-page-id)
file-id (mf/use-ctx ctx/current-file-id) file-id (mf/use-ctx ctx/current-file-id)
shapes (mf/deref refs/selected-objects) shapes (mf/deref refs/selected-objects)
shapes-with-children (mf/deref refs/selected-shapes-with-children)] shapes-with-children (mf/deref refs/selected-shapes-with-children)]
[:& options-content {:shapes shapes [:> options-content* {:shapes shapes
:selected selected :selected selected
:shapes-with-children shapes-with-children :shapes-with-children shapes-with-children
:file-id file-id :file-id file-id
:page-id page-id :page-id page-id
:section section :section section
:on-change-section on-change-section :on-change-section on-change-section
:on-expand on-expand}])) :on-expand on-expand}]))

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

@ -456,7 +456,7 @@
type (if (= type "multiple") :simple :multiple)] type (if (= type "multiple") :simple :multiple)]
(on-type-change type)))) (on-type-change type))))
props (mf/spread props {:on-change on-change})] props (mf/spread-object props {:on-change on-change})]
(mf/with-effect [] (mf/with-effect []
;; on destroy component ;; on destroy component

25
frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_item.cljs
View file

@ -43,8 +43,7 @@
[prop] [prop]
(select-margins (= prop :m1) (= prop :m2) (= prop :m3) (= prop :m4))) (select-margins (= prop :m1) (= prop :m2) (= prop :m3) (= prop :m4)))
(mf/defc margin-simple (mf/defc margin-simple*
{::mf/props :obj}
[{:keys [value on-change on-blur]}] [{:keys [value on-change on-blur]}]
(let [m1 (:m1 value) (let [m1 (:m1 value)
m2 (:m2 value) m2 (:m2 value)
@ -103,8 +102,7 @@
:nillable true :nillable true
:value m2}]]])) :value m2}]]]))
(mf/defc margin-multiple (mf/defc margin-multiple*
{::mf/props :obj}
[{:keys [value on-change on-blur]}] [{:keys [value on-change on-blur]}]
(let [m1 (:m1 value) (let [m1 (:m1 value)
m2 (:m2 value) m2 (:m2 value)
@ -182,14 +180,13 @@
:value m4}]]])) :value m4}]]]))
(mf/defc margin-section (mf/defc margin-section*
{::mf/props :obj {::mf/private true
::mf/private true
::mf/expect-props #{:value :type :on-type-change :on-change}} ::mf/expect-props #{:value :type :on-type-change :on-change}}
[{:keys [type on-type-change] :as props}] [{:keys [type on-type-change] :as props}]
(let [type (d/nilv type :simple) (let [type (d/nilv type :simple)
on-blur (mf/use-fn #(select-margins false false false false)) on-blur (mf/use-fn #(select-margins false false false false))
props (mf/spread props :on-blur on-blur) props (mf/spread-props props {:on-blur on-blur})
on-type-change' on-type-change'
(mf/use-fn (mf/use-fn
@ -206,10 +203,10 @@
[:div {:class (stl/css :inputs-wrapper)} [:div {:class (stl/css :inputs-wrapper)}
(cond (cond
(= type :simple) (= type :simple)
[:> margin-simple props] [:> margin-simple* props]
(= type :multiple) (= type :multiple)
[:> margin-multiple props])] [:> margin-multiple* props])]
[:button {:class (stl/css-case [:button {:class (stl/css-case
:margin-mode true :margin-mode true
@ -500,10 +497,10 @@
(when is-layout-child? (when is-layout-child?
[:div {:class (stl/css :row)} [:div {:class (stl/css :row)}
[:& margin-section {:value (:layout-item-margin values) [:> margin-section* {:value (:layout-item-margin values)
:type (:layout-item-margin-type values) :type (:layout-item-margin-type values)
:on-type-change on-margin-type-change :on-type-change on-margin-type-change
:on-change on-margin-change}]]) :on-change on-margin-change}]])
(when (or (= h-sizing :fill) (when (or (= h-sizing :fill)
(= v-sizing :fill)) (= v-sizing :fill))

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

@ -226,14 +226,13 @@
:on-click handle-pin-snapshot} :on-click handle-pin-snapshot}
(tr "workspace.versions.button.pin")]]]])]]])) (tr "workspace.versions.button.pin")]]]])]]]))
(mf/defc versions-toolbox (mf/defc versions-toolbox*
[] []
(let [profiles (mf/deref refs/profiles) (let [profiles (mf/deref refs/profiles)
profile (mf/deref refs/profile) profile (mf/deref refs/profile)
expanded (mf/use-state #{}) expanded (mf/use-state #{})
{:keys [status data editing]} {:keys [status data editing]}
(mf/deref versions) (mf/deref versions)