3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-07-26 00:47:16 +02:00
Code Issues Projects Releases Packages Wiki Activity

💄 Make the title-bar component usable externally

Browse source 
By removing the usage of `?` character on prop names
This commit is contained in:
Andrey Antukh 2024-01-09 09:23:41 +01:00
parent e866e99804
commit 1822103936
36 changed files with 116 additions and 113 deletions
Download patch file Download diff file Expand all files Collapse all files

10
frontend/src/app/main/ui/components/title_bar.cljs
View file

@ -13,23 +13,23 @@
(mf/defc title-bar (mf/defc title-bar
{::mf/wrap-props false} {::mf/wrap-props false}
[{:keys [collapsable? collapsed? on-collapsed title children on-btn-click btn-children class clickable-all?]}] [{:keys [collapsable collapsed on-collapsed title children on-btn-click btn-children class all-clickable]}]
(let [klass (dm/str (stl/css :title-bar) " " class)] (let [klass (dm/str (stl/css :title-bar) " " class)]
[:div {:class klass} [:div {:class klass}
(if collapsable? (if ^boolean collapsable
[:div {:class (stl/css :title-wrapper)} [:div {:class (stl/css :title-wrapper)}
(if clickable-all? (if ^boolean all-clickable
[:button {:class (stl/css :toggle-btn) [:button {:class (stl/css :toggle-btn)
:on-click on-collapsed} :on-click on-collapsed}
[:span {:class (stl/css-case [:span {:class (stl/css-case
:collapsabled-icon true :collapsabled-icon true
:rotated collapsed?)} :rotated collapsed)}
i/arrow-refactor] i/arrow-refactor]
[:div {:class (stl/css :title)} title]] [:div {:class (stl/css :title)} title]]
[:* [:*
[:button {:class (stl/css-case [:button {:class (stl/css-case
:collapsabled-icon true :collapsabled-icon true
:rotated collapsed?) :rotated collapsed)
:on-click on-collapsed} :on-click on-collapsed}
i/arrow-refactor] i/arrow-refactor]
[:div {:class (stl/css :title)} title]])] [:div {:class (stl/css :title)} title]])]

14
frontend/src/app/main/ui/debug/components_preview.cljs
View file

@ -102,26 +102,26 @@
[:h3 "Titles"] [:h3 "Titles"]
[:& component-wrapper [:& component-wrapper
{:title "Title"} {:title "Title"}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title "Title"}]] :title "Title"}]]
[:& component-wrapper [:& component-wrapper
{:title "Title and action button"} {:title "Title and action button"}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title "Title" :title "Title"
:on-btn-click on-btn-click :on-btn-click on-btn-click
:btn-children i/add-refactor}]] :btn-children i/add-refactor}]]
[:& component-wrapper [:& component-wrapper
{:title "Collapsed title and action button"} {:title "Collapsed title and action button"}
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? collapsed? :collapsed collapsed?
:on-collapsed toggle-collapsed :on-collapsed toggle-collapsed
:title "Title" :title "Title"
:on-btn-click on-btn-click :on-btn-click on-btn-click
:btn-children i/add-refactor}]] :btn-children i/add-refactor}]]
[:& component-wrapper [:& component-wrapper
{:title "Collapsed title and children"} {:title "Collapsed title and children"}
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? collapsed? :collapsed collapsed?
:on-collapsed toggle-collapsed :on-collapsed toggle-collapsed
:title "Title"} :title "Title"}
[:& tab-container {:on-change-tab set-tab [:& tab-container {:on-change-tab set-tab

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

@ -15,9 +15,9 @@
(mf/defc annotation (mf/defc annotation
[{:keys [content] :as props}] [{:keys [content] :as props}]
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "workspace.options.component.annotation") :title (tr "workspace.options.component.annotation")
:class (stl/css :title-spacing-annotation)} :class (stl/css :title-spacing-annotation)}
[:& copy-button {:data content}]] [:& copy-button {:data content}]]
[:div {:class (stl/css :annotation-content)} content]]) [:div {:class (stl/css :annotation-content)} content]])

6
frontend/src/app/main/ui/viewer/inspect/attributes/blur.cljs
View file

@ -21,9 +21,9 @@
(let [shapes (->> shapes (filter has-blur?))] (let [shapes (->> shapes (filter has-blur?))]
(when (seq shapes) (when (seq shapes)
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "inspect.attributes.blur") :title (tr "inspect.attributes.blur")
:class (stl/css :title-spacing-blur)} :class (stl/css :title-spacing-blur)}
(when (= (count shapes) 1) (when (= (count shapes) 1)
[:& copy-button {:data (css/get-css-property objects (first shapes) :filter)}])] [:& copy-button {:data (css/get-css-property objects (first shapes) :filter)}])]

6
frontend/src/app/main/ui/viewer/inspect/attributes/fill.cljs
View file

@ -54,9 +54,9 @@
(let [shapes (filter has-fill? shapes)] (let [shapes (filter has-fill? shapes)]
(when (seq shapes) (when (seq shapes)
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "inspect.attributes.fill") :title (tr "inspect.attributes.fill")
:class (stl/css :title-spacing-fill)}] :class (stl/css :title-spacing-fill)}]
[:div {:class (stl/css :attributes-content)} [:div {:class (stl/css :attributes-content)}
(for [shape shapes] (for [shape shapes]

6
frontend/src/app/main/ui/viewer/inspect/attributes/geometry.cljs
View file

@ -31,9 +31,9 @@
(mf/defc geometry-panel (mf/defc geometry-panel
[{:keys [objects shapes]}] [{:keys [objects shapes]}]
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "inspect.attributes.size") :title (tr "inspect.attributes.size")
:class (stl/css :title-spacing-geometry)} :class (stl/css :title-spacing-geometry)}
(when (= (count shapes) 1) (when (= (count shapes) 1)
[:& copy-button {:data (css/get-shape-properties-css objects (first shapes) properties)}])] [:& copy-button {:data (css/get-shape-properties-css objects (first shapes) properties)}])]

6
frontend/src/app/main/ui/viewer/inspect/attributes/layout.cljs
View file

@ -45,9 +45,9 @@
(when (seq shapes) (when (seq shapes)
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title "Layout" :title "Layout"
:class (stl/css :title-spacing-layout)} :class (stl/css :title-spacing-layout)}
(when (= (count shapes) 1) (when (= (count shapes) 1)
[:& copy-button {:data (css/get-shape-properties-css objects (first shapes) properties)}])] [:& copy-button {:data (css/get-shape-properties-css objects (first shapes) properties)}])]

6
frontend/src/app/main/ui/viewer/inspect/attributes/layout_element.cljs
View file

@ -63,9 +63,9 @@
(when some-layout-prop? (when some-layout-prop?
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title menu-title :title menu-title
:class (stl/css :title-spacing-layout-element)} :class (stl/css :title-spacing-layout-element)}
(when (= (count shapes) 1) (when (= (count shapes) 1)
[:& copy-button {:data (css/get-shape-properties-css objects (first shapes) properties)}])] [:& copy-button {:data (css/get-shape-properties-css objects (first shapes) properties)}])]

6
frontend/src/app/main/ui/viewer/inspect/attributes/shadow.cljs
View file

@ -53,9 +53,9 @@
(when (and (seq shapes) (> (count shapes) 0)) (when (and (seq shapes) (> (count shapes) 0))
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "inspect.attributes.shadow") :title (tr "inspect.attributes.shadow")
:class (stl/css :title-spacing-shadow)}] :class (stl/css :title-spacing-shadow)}]
[:div {:class (stl/css :attributes-content)} [:div {:class (stl/css :attributes-content)}
(for [shape shapes] (for [shape shapes]

6
frontend/src/app/main/ui/viewer/inspect/attributes/stroke.cljs
View file

@ -61,9 +61,9 @@
(let [shapes (->> shapes (filter has-stroke?))] (let [shapes (->> shapes (filter has-stroke?))]
(when (seq shapes) (when (seq shapes)
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "inspect.attributes.stroke") :title (tr "inspect.attributes.stroke")
:class (stl/css :title-spacing-stroke)}] :class (stl/css :title-spacing-stroke)}]
[:div {:class (stl/css :attributes-content)} [:div {:class (stl/css :attributes-content)}
(for [shape shapes] (for [shape shapes]

6
frontend/src/app/main/ui/viewer/inspect/attributes/svg.cljs
View file

@ -47,7 +47,7 @@
(let [shape (first shapes)] (let [shape (first shapes)]
(when (seq (:svg-attrs shape)) (when (seq (:svg-attrs shape))
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "workspace.sidebar.options.svg-attrs.title") :title (tr "workspace.sidebar.options.svg-attrs.title")
:class (stl/css :title-spacing-svg)}] :class (stl/css :title-spacing-svg)}]
[:& svg-block {:shape shape}]]))) [:& svg-block {:shape shape}]])))

6
frontend/src/app/main/ui/viewer/inspect/attributes/text.cljs
View file

@ -189,9 +189,9 @@
[{:keys [shapes]}] [{:keys [shapes]}]
(when-let [shapes (seq (filter has-text? shapes))] (when-let [shapes (seq (filter has-text? shapes))]
[:div {:class (stl/css :attributes-block)} [:div {:class (stl/css :attributes-block)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "inspect.attributes.typography") :title (tr "inspect.attributes.typography")
:class (stl/css :title-spacing-text)}] :class (stl/css :title-spacing-text)}]
(for [shape shapes] (for [shape shapes]
[:& text-block {:shape shape [:& text-block {:shape shape

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

@ -136,9 +136,9 @@
vec)))) vec))))
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "workspace.options.export") :title (tr "workspace.options.export")
:class (stl/css :title-spacing-export-viewer)} :class (stl/css :title-spacing-export-viewer)}
[:button {:class (stl/css :add-export) [:button {:class (stl/css :add-export)
:on-click add-export} i/add-refactor]]] :on-click add-export} i/add-refactor]]]

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

@ -199,9 +199,9 @@
[:* [:*
[:div {:class (stl/css :section)} [:div {:class (stl/css :section)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "workspace.libraries.in-this-file") :title (tr "workspace.libraries.in-this-file")
:class (stl/css :title-spacing-lib)}] :class (stl/css :title-spacing-lib)}]
[:div {:class (stl/css :section-list)} [:div {:class (stl/css :section-list)}
[:div {:class (stl/css :section-list-item)} [:div {:class (stl/css :section-list-item)}
@ -245,9 +245,9 @@
i/detach-refactor]])]] i/detach-refactor]])]]
[:div {:class (stl/css :section)} [:div {:class (stl/css :section)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "workspace.libraries.shared-libraries") :title (tr "workspace.libraries.shared-libraries")
:class (stl/css :title-spacing-lib)}] :class (stl/css :title-spacing-lib)}]
[:div {:class (stl/css :libraries-search)} [:div {:class (stl/css :libraries-search)}
[:& search-bar {:on-change change-search-term [:& search-bar {:on-change change-search-term
:value search-term :value search-term

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

@ -55,7 +55,9 @@
(mf/use-fn #(st/emit! (dw/toggle-layout-flag :collapse-left-sidebar))) (mf/use-fn #(st/emit! (dw/toggle-layout-flag :collapse-left-sidebar)))
on-tab-change on-tab-change
(mf/use-fn #(st/emit! (dw/go-to-layout %)))] (mf/use-fn #(do
(prn "on-tab-change" %)
(st/emit! (dw/go-to-layout %))))]
[:aside {:ref parent-ref [:aside {:ref parent-ref
:id "left-sidebar-aside" :id "left-sidebar-aside"

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

@ -136,9 +136,9 @@
title-buttons (filter #(= (get-role %) :title-button) children) title-buttons (filter #(= (get-role %) :title-button) children)
content (filter #(= (get-role %) :content) children)] content (filter #(= (get-role %) :content) children)]
[:div {:class (stl/css :asset-section)} [:div {:class (stl/css :asset-section)}
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? (not open?) :collapsed (not open?)
:clickable-all? true :all-clickable true
:on-collapsed #(st/emit! (dw/set-assets-section-open file-id section (not open?))) :on-collapsed #(st/emit! (dw/set-assets-section-open file-id section (not open?)))
:class (stl/css :title-spacing) :class (stl/css :title-spacing)
:title (mf/html [:span {:class (stl/css :title-name)} :title (mf/html [:span {:class (stl/css :title-name)}
@ -154,6 +154,7 @@
content)])) content)]))
(mf/defc asset-section-block (mf/defc asset-section-block
{::mf/wrap-props false}
[{:keys [children]}] [{:keys [children]}]
[:* children]) [:* children])
@ -161,11 +162,11 @@
[rename components-to-group group-name] [rename components-to-group group-name]
(let [undo-id (js/Symbol)] (let [undo-id (js/Symbol)]
(st/emit! (dwu/start-undo-transaction undo-id)) (st/emit! (dwu/start-undo-transaction undo-id))
(apply st/emit! (->> components-to-group
(->> components-to-group (map #(rename
(map #(rename (:id %)
(:id %) (add-group % group-name)))
(add-group % group-name))))) (run! st/emit!))
(st/emit! (dwu/commit-undo-transaction undo-id)))) (st/emit! (dwu/commit-undo-transaction undo-id))))
(defn on-drop-asset (defn on-drop-asset

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

@ -52,9 +52,9 @@
(fn [] (fn []
(st/emit! (dw/set-assets-section-open file-id :library (not open?)))))] (st/emit! (dw/set-assets-section-open file-id :library (not open?)))))]
[:div {:class (stl/css :library-title)} [:div {:class (stl/css :library-title)}
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? (not open?) :collapsed (not open?)
:clickable-all? true :all-clickable true
:on-collapsed toggle-open :on-collapsed toggle-open
:title (if local? :title (if local?
(mf/html [:div {:class (stl/css :special-title)} (mf/html [:div {:class (stl/css :special-title)}

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

@ -46,9 +46,9 @@
(mf/use-fn #(swap! menu-state cmm/close-context-menu))] (mf/use-fn #(swap! menu-state cmm/close-context-menu))]
[:div {:class (stl/css :group-title) [:div {:class (stl/css :group-title)
:on-context-menu on-context-menu} :on-context-menu on-context-menu}
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? (not group-open?) :collapsed (not group-open?)
:clickable-all? true :all-clickable true
:on-collapsed on-fold-group :on-collapsed on-fold-group
:title (mf/html [:* (when-not (empty? other-path) :title (mf/html [:* (when-not (empty? other-path)
[:span {:class (stl/css :pre-path) [:span {:class (stl/css :pre-path)

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

@ -374,7 +374,7 @@
i/tick-refactor])]])] i/tick-refactor])]])]
[:div {:class (stl/css :tool-window-bar)} [:div {:class (stl/css :tool-window-bar)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (:name page) :title (:name page)
:on-btn-click toggle-search :on-btn-click toggle-search
:btn-children i/search-refactor}]]))])) :btn-children i/search-refactor}]]))]))

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/blur.cljs
View file

@ -77,8 +77,8 @@
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? has-value? [:& title-bar {:collapsable has-value?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title (case type :title (case type
:multiple (tr "workspace.options.blur-options.title.multiple") :multiple (tr "workspace.options.blur-options.title.multiple")

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/color_selection.cljs
View file

@ -215,8 +215,8 @@
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? has-colors? [:& title-bar {:collapsable has-colors?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title (tr "workspace.options.selection-color") :title (tr "workspace.options.selection-color")
:class (stl/css-case :title-spacing-selected-colors (not has-colors?))}]] :class (stl/css-case :title-spacing-selected-colors (not has-colors?))}]]

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

@ -484,8 +484,8 @@
:on-click on-component-back} :on-click on-component-back}
[:span i/arrow-refactor] [:span i/arrow-refactor]
[:span (tr "workspace.options.component")]] [:span (tr "workspace.options.component")]]
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title (tr "workspace.options.component") :title (tr "workspace.options.component")
:class (stl/css :title-spacing-component)}])] :class (stl/css :title-spacing-component)}])]

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs
View file

@ -157,8 +157,8 @@
(when in-frame? (when in-frame?
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title (tr "workspace.options.constraints")}]] :title (tr "workspace.options.constraints")}]]
(when open? (when open?

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/exports.cljs
View file

@ -171,8 +171,8 @@
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? has-exports? [:& title-bar {:collapsable has-exports?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title (tr (if (> (count ids) 1) "workspace.options.export-multiple" "workspace.options.export")) :title (tr (if (> (count ids) 1) "workspace.options.export-multiple" "workspace.options.export"))
:class (stl/css-case :title-spacing-export (not has-exports?))} :class (stl/css-case :title-spacing-export (not has-exports?))}

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

@ -137,8 +137,8 @@
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? has-fills? [:& title-bar {:collapsable has-fills?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title label :title label
:class (stl/css-case :title-spacing-fill (not has-fills?))} :class (stl/css-case :title-spacing-fill (not has-fills?))}

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/frame_grid.cljs
View file

@ -294,8 +294,8 @@
handle-create-grid (mf/use-fn (mf/deps id) #(st/emit! (dw/add-frame-grid id)))] handle-create-grid (mf/use-fn (mf/deps id) #(st/emit! (dw/add-frame-grid id)))]
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:& title-bar {:collapsable? has-frame-grids? [:& title-bar {:collapsable has-frame-grids?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:class (stl/css-case :title-spacing-board-grid (not has-frame-grids?)) :class (stl/css-case :title-spacing-board-grid (not has-frame-grids?))
:title (tr "workspace.options.guides.title")} :title (tr "workspace.options.guides.title")}

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

@ -165,8 +165,8 @@
[:div {:class (stl/css :grid-cell-menu)} [:div {:class (stl/css :grid-cell-menu)}
[:div {:class (stl/css :grid-cell-menu-title)} [:div {:class (stl/css :grid-cell-menu-title)}
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed #(swap! state* update :open not) :on-collapsed #(swap! state* update :open not)
:title "Grid cell"}]] :title "Grid cell"}]]

18
frontend/src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
View file

@ -157,9 +157,9 @@
[{:keys [flows]}] [{:keys [flows]}]
(when (seq flows) (when (seq flows)
[:div {:class (stl/css :interaction-options)} [:div {:class (stl/css :interaction-options)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "workspace.options.flows.flow-starts") :title (tr "workspace.options.flows.flow-starts")
:class (stl/css :title-spacing-layout-flow)}] :class (stl/css :title-spacing-layout-flow)}]
(for [flow flows] (for [flow flows]
[:& flow-item {:flow flow :key (str (:id flow))}])])) [:& flow-item {:flow flow :key (str (:id flow))}])]))
@ -170,9 +170,9 @@
add-flow (mf/use-fn #(st/emit! (dwi/add-flow-selected-frame)))] add-flow (mf/use-fn #(st/emit! (dwi/add-flow-selected-frame)))]
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "workspace.options.flows.flow") :title (tr "workspace.options.flows.flow")
:class (stl/css :title-spacing-layout-flow)} :class (stl/css :title-spacing-layout-flow)}
(when (nil? flow) (when (nil? flow)
[:button {:class (stl/css :add-flow-btn) [:button {:class (stl/css :add-flow-btn)
:title (tr "workspace.options.flows.add-flow-start") :title (tr "workspace.options.flows.add-flow-start")
@ -712,9 +712,9 @@
[:div {:class (stl/css :interaction-options)} [:div {:class (stl/css :interaction-options)}
(when (and shape (not (cfh/unframed-shape? shape))) (when (and shape (not (cfh/unframed-shape? shape)))
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "workspace.options.interactions") :title (tr "workspace.options.interactions")
:class (stl/css :title-spacing-layout-interactions)} :class (stl/css :title-spacing-layout-interactions)}
[:button {:class (stl/css :add-interaction-btn) [:button {:class (stl/css :add-interaction-btn)
:on-click add-interaction} :on-click add-interaction}

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

@ -895,8 +895,8 @@
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? has-layout? [:& title-bar {:collapsable has-layout?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title "Layout" :title "Layout"
:class (stl/css-case :title-spacing-layout (not has-layout?))} :class (stl/css-case :title-spacing-layout (not has-layout?))}

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

@ -361,8 +361,8 @@
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? has-content? [:& title-bar {:collapsable has-content?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title title :title title
:class (stl/css-case :title-spacing-layout-element true :class (stl/css-case :title-spacing-layout-element true

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/shadow.cljs
View file

@ -288,8 +288,8 @@
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? has-shadows? [:& title-bar {:collapsable has-shadows?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title (case type :title (case type
:multiple (tr "workspace.options.shadow-options.title.multiple") :multiple (tr "workspace.options.shadow-options.title.multiple")

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/stroke.cljs
View file

@ -163,8 +163,8 @@
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? has-strokes? [:& title-bar {:collapsable has-strokes?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title label :title label
:class (stl/css-case :title-spacing-stroke (not has-strokes?))} :class (stl/css-case :title-spacing-stroke (not has-strokes?))}

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/svg_attrs.cljs
View file

@ -86,8 +86,8 @@
(when-not (empty? attrs) (when-not (empty? attrs)
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-set-title)} [:div {:class (stl/css :element-set-title)}
[:& title-bar {:collapsable? has-attributes? [:& title-bar {:collapsable has-attributes?
:collapsed? (not open?) :collapsed (not open?)
:on-collapsed toggle-content :on-collapsed toggle-content
:title (tr "workspace.sidebar.options.svg-attrs.title") :title (tr "workspace.sidebar.options.svg-attrs.title")
:class (stl/css-case :title-spacing-svg-attrs (not has-attributes?))}]] :class (stl/css-case :title-spacing-svg-attrs (not has-attributes?))}]]

4
frontend/src/app/main/ui/workspace/sidebar/options/menus/text.cljs
View file

@ -283,8 +283,8 @@
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? (not main-menu-open?) :collapsed (not main-menu-open?)
:on-collapsed toggle-main-menu :on-collapsed toggle-main-menu
:title label :title label
:class (stl/css :title-spacing-text)} :class (stl/css :title-spacing-text)}

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

@ -28,9 +28,9 @@
on-close (mf/use-fn #(st/emit! (dwu/commit-undo-transaction :options)))] on-close (mf/use-fn #(st/emit! (dwu/commit-undo-transaction :options)))]
[:div {:class (stl/css :element-set)} [:div {:class (stl/css :element-set)}
[:div {:class (stl/css :element-title)} [:div {:class (stl/css :element-title)}
[:& title-bar {:collapsable? false [:& title-bar {:collapsable false
:title (tr "workspace.options.canvas-background") :title (tr "workspace.options.canvas-background")
:class (stl/css :title-spacing-page)}]] :class (stl/css :title-spacing-page)}]]
[:div {:class (stl/css :element-content)} [:div {:class (stl/css :element-content)}
[:& color-row [:& color-row
{:disable-gradient true {:disable-gradient true

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

@ -210,12 +210,12 @@
[:div {:class (stl/css :sitemap) [:div {:class (stl/css :sitemap)
:style #js {"--height" (str size "px")}} :style #js {"--height" (str size "px")}}
[:& title-bar {:collapsable? true [:& title-bar {:collapsable true
:collapsed? (not show-pages?) :collapsed (not show-pages?)
:on-collapsed toggle-pages :on-collapsed toggle-pages
:clickable-all? true :all-clickable true
:title (tr "workspace.sidebar.sitemap") :title (tr "workspace.sidebar.sitemap")
:class (stl/css :title-spacing-sitemap)} :class (stl/css :title-spacing-sitemap)}
(if ^boolean read-only? (if ^boolean read-only?
[:di {:class (stl/css :view-only-mode)} [:di {:class (stl/css :view-only-mode)}