From 0901807db847ca7655e95af91454486cb8abd55b Mon Sep 17 00:00:00 2001 From: Pablo Alba Date: Mon, 17 Mar 2025 16:34:59 +0100 Subject: [PATCH] :sparkles: Update inspect-title-bar and copy-button to the new components format --- .../app/main/ui/components/copy_button.cljs | 3 +- .../src/app/main/ui/components/title_bar.cljs | 3 +- .../src/app/main/ui/inspect/annotation.cljs | 6 ++-- .../app/main/ui/inspect/attributes/blur.cljs | 12 ++++---- .../main/ui/inspect/attributes/common.cljs | 16 +++++----- .../app/main/ui/inspect/attributes/fill.cljs | 4 +-- .../main/ui/inspect/attributes/geometry.cljs | 12 ++++---- .../app/main/ui/inspect/attributes/image.cljs | 6 ++-- .../main/ui/inspect/attributes/layout.cljs | 12 ++++---- .../ui/inspect/attributes/layout_element.cljs | 8 ++--- .../main/ui/inspect/attributes/shadow.cljs | 10 +++---- .../main/ui/inspect/attributes/stroke.cljs | 4 +-- .../app/main/ui/inspect/attributes/svg.cljs | 12 ++++---- .../app/main/ui/inspect/attributes/text.cljs | 30 +++++++++---------- .../main/ui/inspect/attributes/variant.cljs | 10 +++---- frontend/src/app/main/ui/inspect/code.cljs | 14 ++++----- 16 files changed, 80 insertions(+), 82 deletions(-) diff --git a/frontend/src/app/main/ui/components/copy_button.cljs b/frontend/src/app/main/ui/components/copy_button.cljs index f4395bbd4..a06e6f9cf 100644 --- a/frontend/src/app/main/ui/components/copy_button.cljs +++ b/frontend/src/app/main/ui/components/copy_button.cljs @@ -16,8 +16,7 @@ [app.util.webapi :as wapi] [rumext.v2 :as mf])) -(mf/defc copy-button - {::mf/props :obj} +(mf/defc copy-button* [{:keys [data on-copied children class aria-label]}] (let [active* (mf/use-state false) active? (deref active*) diff --git a/frontend/src/app/main/ui/components/title_bar.cljs b/frontend/src/app/main/ui/components/title_bar.cljs index 04e621133..07d59ac45 100644 --- a/frontend/src/app/main/ui/components/title_bar.cljs +++ b/frontend/src/app/main/ui/components/title_bar.cljs @@ -51,8 +51,7 @@ :on-click on-btn-click} btn-children])])) -(mf/defc inspect-title-bar - {::mf/props :obj} +(mf/defc inspect-title-bar* [{:keys [class title]}] [:div {:class (dm/str (stl/css :title-bar) " " class)} [:div {:class (stl/css :title-only :inspect-title)} title]]) diff --git a/frontend/src/app/main/ui/inspect/annotation.cljs b/frontend/src/app/main/ui/inspect/annotation.cljs index 07dba6eae..7bfd9805c 100644 --- a/frontend/src/app/main/ui/inspect/annotation.cljs +++ b/frontend/src/app/main/ui/inspect/annotation.cljs @@ -7,7 +7,7 @@ (ns app.main.ui.inspect.annotation (:require-macros [app.main.style :as stl]) (:require - [app.main.ui.components.copy-button :refer [copy-button]] + [app.main.ui.components.copy-button :refer [copy-button*]] [app.main.ui.components.title-bar :refer [title-bar]] [app.util.i18n :as i18n :refer [tr]] [rumext.v2 :as mf])) @@ -18,7 +18,7 @@ [:& title-bar {:collapsable false :title (tr "workspace.options.component.annotation") :class (stl/css :title-spacing-annotation)} - [:& copy-button {:data content - :class (stl/css :copy-btn-title)}]] + [:> copy-button* {:data content + :class (stl/css :copy-btn-title)}]] [:div {:class (stl/css :annotation-content)} content]]) diff --git a/frontend/src/app/main/ui/inspect/attributes/blur.cljs b/frontend/src/app/main/ui/inspect/attributes/blur.cljs index 5848208ef..6694af676 100644 --- a/frontend/src/app/main/ui/inspect/attributes/blur.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/blur.cljs @@ -8,8 +8,8 @@ (:require-macros [app.main.style :as stl]) (:require [app.common.data.macros :as dm] - [app.main.ui.components.copy-button :refer [copy-button]] - [app.main.ui.components.title-bar :refer [inspect-title-bar]] + [app.main.ui.components.copy-button :refer [copy-button*]] + [app.main.ui.components.title-bar :refer [inspect-title-bar*]] [app.util.code-gen.style-css :as css] [app.util.i18n :refer [tr]] [rumext.v2 :as mf])) @@ -22,12 +22,12 @@ (let [shapes (->> shapes (filter has-blur?))] (when (seq shapes) [:div {:class (stl/css :attributes-block)} - [:& inspect-title-bar + [:> inspect-title-bar* {:title (tr "inspect.attributes.blur") :class (stl/css :title-spacing-blur)} (when (= (count shapes) 1) - [:& copy-button {:data (css/get-css-property objects (first shapes) :filter) - :class (stl/css :copy-btn-title)}])] + [:> copy-button* {:data (css/get-css-property objects (first shapes) :filter) + :class (stl/css :copy-btn-title)}])] [:div {:class (stl/css :attributes-content)} (for [shape shapes] @@ -35,6 +35,6 @@ :key (dm/str "block-" (:id shape) "-blur")} [:div {:class (stl/css :global/attr-label)} "Filter"] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (css/get-css-property objects shape :filter)} + [:> copy-button* {:data (css/get-css-property objects shape :filter)} [:div {:class (stl/css :button-children)} (css/get-css-value objects shape :filter)]]]])]]))) diff --git a/frontend/src/app/main/ui/inspect/attributes/common.cljs b/frontend/src/app/main/ui/inspect/attributes/common.cljs index 726b695a6..b9ab29bd7 100644 --- a/frontend/src/app/main/ui/inspect/attributes/common.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/common.cljs @@ -15,7 +15,7 @@ [app.main.refs :as refs] [app.main.store :as st] [app.main.ui.components.color-bullet :as cb] - [app.main.ui.components.copy-button :refer [copy-button]] + [app.main.ui.components.copy-button :refer [copy-button*]] [app.main.ui.components.select :refer [select]] [app.main.ui.formats :as fmt] [app.util.i18n :refer [tr]] @@ -75,8 +75,8 @@ [:div {:class (stl/css :format-wrapper)} [:div {:class (stl/css :image-format)} (tr "media.image.short")]] - [:& copy-button {:data copy-data - :class (stl/css :color-row-copy-btn)} + [:> copy-button* {:data copy-data + :class (stl/css :color-row-copy-btn)} [:div {:class (stl/css-case :color-info true :two-line (some? color-library-name))} [:div {:class (stl/css :first-row)} @@ -116,11 +116,11 @@ (when (:gradient color) [:div {:class (stl/css :format-info)} "rgba"])] - [:& copy-button {:data copy-data - :aria-label (tr "labels.copy-color") - :class (stl/css-case :color-row-copy-btn true - :one-line (not color-library-name) - :two-line (some? color-library-name))} + [:> copy-button* {:data copy-data + :aria-label (tr "labels.copy-color") + :class (stl/css-case :color-row-copy-btn true + :one-line (not color-library-name) + :two-line (some? color-library-name))} [:div {:class (stl/css :first-row)} [:div {:class (stl/css :name-opacity)} [:span {:class (stl/css-case :color-value-wrapper true diff --git a/frontend/src/app/main/ui/inspect/attributes/fill.cljs b/frontend/src/app/main/ui/inspect/attributes/fill.cljs index 7dd90bfb9..415cfce75 100644 --- a/frontend/src/app/main/ui/inspect/attributes/fill.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/fill.cljs @@ -7,7 +7,7 @@ (ns app.main.ui.inspect.attributes.fill (:require-macros [app.main.style :as stl]) (:require - [app.main.ui.components.title-bar :refer [inspect-title-bar]] + [app.main.ui.components.title-bar :refer [inspect-title-bar*]] [app.main.ui.inspect.attributes.common :refer [color-row]] [app.util.code-gen.style-css :as css] [app.util.i18n :refer [tr]] @@ -53,7 +53,7 @@ (let [shapes (filter has-fill? shapes)] (when (seq shapes) [:div {:class (stl/css :attributes-block)} - [:& inspect-title-bar + [:> inspect-title-bar* {:title (tr "inspect.attributes.fill") :class (stl/css :title-spacing-fill)}] diff --git a/frontend/src/app/main/ui/inspect/attributes/geometry.cljs b/frontend/src/app/main/ui/inspect/attributes/geometry.cljs index 20b7637ea..85aca7b04 100644 --- a/frontend/src/app/main/ui/inspect/attributes/geometry.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/geometry.cljs @@ -9,8 +9,8 @@ (:require [app.common.data :as d] [app.common.data.macros :as dm] - [app.main.ui.components.copy-button :refer [copy-button]] - [app.main.ui.components.title-bar :refer [inspect-title-bar]] + [app.main.ui.components.copy-button :refer [copy-button*]] + [app.main.ui.components.title-bar :refer [inspect-title-bar*]] [app.main.ui.inspect.attributes.common :as cmm] [app.util.code-gen.style-css :as css] [app.util.i18n :refer [tr]] @@ -29,20 +29,20 @@ :class (stl/css :geometry-row)} [:div {:class (stl/css :global/attr-label)} property-name] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (css/get-css-property objects shape property)} + [:> copy-button* {:data (css/get-css-property objects shape property)} [:div {:class (stl/css :button-children)} value]]]])))]) (mf/defc geometry-panel [{:keys [objects shapes]}] [:div {:class (stl/css :attributes-block)} - [:& inspect-title-bar + [:> inspect-title-bar* {:title (tr "inspect.attributes.size") :class (stl/css :title-spacing-geometry)} (when (= (count shapes) 1) - [:& copy-button {:data (css/get-shape-properties-css objects (first shapes) properties) - :class (stl/css :copy-btn-title)}])] + [:> copy-button* {:data (css/get-shape-properties-css objects (first shapes) properties) + :class (stl/css :copy-btn-title)}])] (for [shape shapes] [:& geometry-block {:shape shape diff --git a/frontend/src/app/main/ui/inspect/attributes/image.cljs b/frontend/src/app/main/ui/inspect/attributes/image.cljs index 3376bb65d..bdf38f0b9 100644 --- a/frontend/src/app/main/ui/inspect/attributes/image.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/image.cljs @@ -10,7 +10,7 @@ [app.common.files.helpers :as cfh] [app.common.media :as cm] [app.config :as cf] - [app.main.ui.components.copy-button :refer [copy-button]] + [app.main.ui.components.copy-button :refer [copy-button*]] [app.util.code-gen.style-css :as css] [app.util.i18n :refer [tr]] [cuerdas.core :as str] @@ -31,14 +31,14 @@ [:div {:class (stl/css :global/attr-label)} (tr "inspect.attributes.image.width")] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (css/get-css-property objects (:metadata shape) :width)} + [:> copy-button* {:data (css/get-css-property objects (:metadata shape) :width)} [:div {:class (stl/css :button-children)} (css/get-css-value objects (:metadata shape) :width)]]]] [:div {:class (stl/css :image-row)} [:div {:class (stl/css :global/attr-label)} (tr "inspect.attributes.image.height")] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (css/get-css-property objects (:metadata shape) :height)} + [:> copy-button* {:data (css/get-css-property objects (:metadata shape) :height)} [:div {:class (stl/css :button-children)} (css/get-css-value objects (:metadata shape) :height)]]]] (let [mtype (-> shape :metadata :mtype) diff --git a/frontend/src/app/main/ui/inspect/attributes/layout.cljs b/frontend/src/app/main/ui/inspect/attributes/layout.cljs index 94fa854ae..3017c589e 100644 --- a/frontend/src/app/main/ui/inspect/attributes/layout.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/layout.cljs @@ -10,8 +10,8 @@ [app.common.data :as d] [app.common.data.macros :as dm] [app.common.types.shape.layout :as ctl] - [app.main.ui.components.copy-button :refer [copy-button]] - [app.main.ui.components.title-bar :refer [inspect-title-bar]] + [app.main.ui.components.copy-button :refer [copy-button*]] + [app.main.ui.components.title-bar :refer [inspect-title-bar*]] [app.main.ui.inspect.attributes.common :as cmm] [app.util.code-gen.style-css :as css] [rumext.v2 :as mf])) @@ -43,7 +43,7 @@ property-name] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (css/get-css-property objects shape property)} + [:> copy-button* {:data (css/get-css-property objects shape property)} [:div {:class (stl/css :button-children)} value]]]])))) (mf/defc layout-panel @@ -52,13 +52,13 @@ (when (seq shapes) [:div {:class (stl/css :attributes-block)} - [:& inspect-title-bar + [:> inspect-title-bar* {:title "Layout" :class (stl/css :title-spacing-layout)} (when (= (count shapes) 1) - [:& copy-button {:data (css/get-shape-properties-css objects (first shapes) properties) - :class (stl/css :copy-btn-title)}])] + [:> copy-button* {:data (css/get-shape-properties-css objects (first shapes) properties) + :class (stl/css :copy-btn-title)}])] (for [shape shapes] [:& layout-block {:shape shape diff --git a/frontend/src/app/main/ui/inspect/attributes/layout_element.cljs b/frontend/src/app/main/ui/inspect/attributes/layout_element.cljs index 0170cd6b0..0d913a4c7 100644 --- a/frontend/src/app/main/ui/inspect/attributes/layout_element.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/layout_element.cljs @@ -10,7 +10,7 @@ [app.common.data :as d] [app.common.data.macros :as dm] [app.common.types.shape.layout :as ctl] - [app.main.ui.components.copy-button :refer [copy-button]] + [app.main.ui.components.copy-button :refer [copy-button*]] [app.main.ui.components.title-bar :refer [title-bar]] [app.main.ui.inspect.attributes.common :as cmm] [app.util.code-gen.style-css :as css] @@ -41,7 +41,7 @@ [:div {:class (stl/css :global/attr-label)} property-name] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (css/get-css-property objects shape property)} + [:> copy-button* {:data (css/get-css-property objects shape property)} [:div {:class (stl/css :button-children)} value]]]])))) (mf/defc layout-element-panel @@ -71,8 +71,8 @@ :title menu-title :class (stl/css :title-spacing-layout-element)} (when (= (count shapes) 1) - [:& copy-button {:data (css/get-shape-properties-css objects (first shapes) properties) - :class (stl/css :copy-btn-title)}])] + [:> copy-button* {:data (css/get-shape-properties-css objects (first shapes) properties) + :class (stl/css :copy-btn-title)}])] (for [shape shapes] [:& layout-element-block {:shape shape diff --git a/frontend/src/app/main/ui/inspect/attributes/shadow.cljs b/frontend/src/app/main/ui/inspect/attributes/shadow.cljs index e6d3af652..1ca32271f 100644 --- a/frontend/src/app/main/ui/inspect/attributes/shadow.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/shadow.cljs @@ -9,8 +9,8 @@ (:require [app.common.data :as d] [app.common.data.macros :as dm] - [app.main.ui.components.copy-button :refer [copy-button]] - [app.main.ui.components.title-bar :refer [inspect-title-bar]] + [app.main.ui.components.copy-button :refer [copy-button*]] + [app.main.ui.components.title-bar :refer [inspect-title-bar*]] [app.main.ui.inspect.attributes.common :refer [color-row]] [app.util.code-gen.style-css :as css] [app.util.i18n :refer [tr]] @@ -32,8 +32,8 @@ [:div {:class (stl/css :shadow-row)} [:div {:class (stl/css :global/attr-label)} (->> shadow :style d/name (str "workspace.options.shadow-options.") (tr))] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (shadow-copy-data shadow) - :class (stl/css :color-row-copy-btn)} + [:> copy-button* {:data (shadow-copy-data shadow) + :class (stl/css :color-row-copy-btn)} [:div {:class (stl/css :button-children) :title (dm/str (tr "workspace.options.shadow-options.offsetx") " " (tr "workspace.options.shadow-options.offsety") " " @@ -53,7 +53,7 @@ (when (and (seq shapes) (> (count shapes) 0)) [:div {:class (stl/css :attributes-block)} - [:& inspect-title-bar + [:> inspect-title-bar* {:title (tr "inspect.attributes.shadow") :class (stl/css :title-spacing-shadow)}] diff --git a/frontend/src/app/main/ui/inspect/attributes/stroke.cljs b/frontend/src/app/main/ui/inspect/attributes/stroke.cljs index 02362de85..bff426e6f 100644 --- a/frontend/src/app/main/ui/inspect/attributes/stroke.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/stroke.cljs @@ -7,7 +7,7 @@ (ns app.main.ui.inspect.attributes.stroke (:require-macros [app.main.style :as stl]) (:require - [app.main.ui.components.title-bar :refer [inspect-title-bar]] + [app.main.ui.components.title-bar :refer [inspect-title-bar*]] [app.main.ui.inspect.attributes.common :refer [color-row]] [app.util.code-gen.style-css :as css] [app.util.i18n :refer [tr]] @@ -48,7 +48,7 @@ (let [shapes (->> shapes (filter has-stroke?))] (when (seq shapes) [:div {:class (stl/css :attributes-block)} - [:& inspect-title-bar + [:> inspect-title-bar* {:title (tr "inspect.attributes.stroke") :class (stl/css :title-spacing-stroke)}] diff --git a/frontend/src/app/main/ui/inspect/attributes/svg.cljs b/frontend/src/app/main/ui/inspect/attributes/svg.cljs index 51b6e554c..c72c5466c 100644 --- a/frontend/src/app/main/ui/inspect/attributes/svg.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/svg.cljs @@ -8,8 +8,8 @@ (:require-macros [app.main.style :as stl]) (:require [app.common.data :as d] - [app.main.ui.components.copy-button :refer [copy-button]] - [app.main.ui.components.title-bar :refer [inspect-title-bar]] + [app.main.ui.components.copy-button :refer [copy-button*]] + [app.main.ui.components.title-bar :refer [inspect-title-bar*]] [app.util.i18n :refer [tr]] [cuerdas.core :as str] [rumext.v2 :as mf])) @@ -24,7 +24,7 @@ [:* [:div {:class (stl/css :attributes-subtitle)} [:span (d/name attr)] - [:& copy-button {:data (map->css value)}]] + [:> copy-button* {:data (map->css value)}]] (for [[attr-key attr-value] value] [:& svg-attr {:attr attr-key :value attr-value :key (str/join "svg-key-" (d/name attr-key))}])] @@ -37,8 +37,8 @@ [:div {:class (stl/css :svg-row)} [:div {:class (stl/css :global/attr-label)} attr-name] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (d/name value) - :class (stl/css :copy-btn-title)} + [:> copy-button* {:data (d/name value) + :class (stl/css :copy-btn-title)} [:div {:class (stl/css :button-children)} (str value)]]]]))) (mf/defc svg-block @@ -52,7 +52,7 @@ (let [shape (first shapes)] (when (seq (:svg-attrs shape)) [:div {:class (stl/css :attributes-block)} - [:& inspect-title-bar + [:> inspect-title-bar* {:title (tr "workspace.sidebar.options.svg-attrs.title") :class (stl/css :title-spacing-svg)}] [:& svg-block {:shape shape}]]))) diff --git a/frontend/src/app/main/ui/inspect/attributes/text.cljs b/frontend/src/app/main/ui/inspect/attributes/text.cljs index e1828710a..71b4306c7 100644 --- a/frontend/src/app/main/ui/inspect/attributes/text.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/text.cljs @@ -13,8 +13,8 @@ [app.main.fonts :as fonts] [app.main.refs :as refs] [app.main.store :as st] - [app.main.ui.components.copy-button :refer [copy-button]] - [app.main.ui.components.title-bar :refer [inspect-title-bar]] + [app.main.ui.components.copy-button :refer [copy-button*]] + [app.main.ui.components.title-bar :refer [inspect-title-bar*]] [app.main.ui.formats :as fmt] [app.main.ui.inspect.attributes.common :refer [color-row]] [app.util.i18n :refer [tr]] @@ -82,15 +82,15 @@ [:div {:class (stl/css :global/attr-label)} (tr "inspect.attributes.typography")] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (copy-style-data typography :font-family :font-weight :font-style) - :class (stl/css :copy-btn-wrapper)} + [:> copy-button* {:data (copy-style-data typography :font-family :font-weight :font-style) + :class (stl/css :copy-btn-wrapper)} [:div {:class (stl/css :button-children)} (:name typography)]]]]) (when (:font-id style) [:div {:class (stl/css :text-row)} [:div {:class (stl/css :global/attr-label)} (tr "inspect.attributes.typography.font-family")] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (copy-style-data style :font-family)} + [:> copy-button* {:data (copy-style-data style :font-family)} [:div {:class (stl/css :button-children)} (-> style :font-id fonts/get-font-data :name)]]]]) @@ -99,7 +99,7 @@ [:div {:class (stl/css :global/attr-label)} (tr "inspect.attributes.typography.font-style")] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (copy-style-data style :font-style)} + [:> copy-button* {:data (copy-style-data style :font-style)} [:div {:class (stl/css :button-children)} (dm/str (:font-style style))]]]]) @@ -108,7 +108,7 @@ [:div {:class (stl/css :global/attr-label)} (tr "inspect.attributes.typography.font-size")] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (copy-style-data style :font-size)} + [:> copy-button* {:data (copy-style-data style :font-size)} [:div {:class (stl/css :button-children)} (fmt/format-pixels (:font-size style))]]]]) @@ -117,7 +117,7 @@ [:div {:class (stl/css :global/attr-label)} (tr "inspect.attributes.typography.font-weight")] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (copy-style-data style :font-weight)} + [:> copy-button* {:data (copy-style-data style :font-weight)} [:div {:class (stl/css :button-children)} (dm/str (:font-weight style))]]]]) @@ -126,7 +126,7 @@ [:div {:class (stl/css :global/attr-label)} (tr "inspect.attributes.typography.line-height")] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (copy-style-data style :line-height)} + [:> copy-button* {:data (copy-style-data style :line-height)} [:div {:class (stl/css :button-children)} (fmt/format-number (:line-height style))]]]]) @@ -135,7 +135,7 @@ [:div {:class (stl/css :global/attr-label)} (tr "inspect.attributes.typography.letter-spacing")] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (copy-style-data style :letter-spacing)} + [:> copy-button* {:data (copy-style-data style :letter-spacing)} [:div {:class (stl/css :button-children)} (fmt/format-pixels (:letter-spacing style))]]]]) @@ -148,7 +148,7 @@ ;; (tr "inspect.attributes.typography.text-decoration.strikethrough") ;; (tr "inspect.attributes.typography.text-decoration.underline") [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (copy-style-data style :text-decoration)} + [:> copy-button* {:data (copy-style-data style :text-decoration)} [:div {:class (stl/css :button-children)} (tr (dm/str "inspect.attributes.typography.text-decoration." (:text-decoration style)))]]]]) @@ -163,12 +163,12 @@ ;; (tr "inspect.attributes.typography.text-transform.uppercase") ;; (tr "inspect.attributes.typography.text-transform.unset") [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data (copy-style-data style :text-transform)} + [:> copy-button* {:data (copy-style-data style :text-transform)} [:div {:class (stl/css :button-children)} (tr (dm/str "inspect.attributes.typography.text-transform." (:text-transform style)))]]]]) - [:& copy-button {:data (str/trim text) - :class (stl/css :attributes-content-row)} + [:> copy-button* {:data (str/trim text) + :class (stl/css :attributes-content-row)} [:span {:class (stl/css :content) :style {:font-family (:font-family style) :font-weight (:font-weight style) @@ -192,7 +192,7 @@ [{:keys [shapes]}] (when-let [shapes (seq (filter has-text? shapes))] [:div {:class (stl/css :attributes-block)} - [:& inspect-title-bar + [:> inspect-title-bar* {:title (tr "inspect.attributes.typography") :class (stl/css :title-spacing-text)}] diff --git a/frontend/src/app/main/ui/inspect/attributes/variant.cljs b/frontend/src/app/main/ui/inspect/attributes/variant.cljs index 30b20dc55..f92e68990 100644 --- a/frontend/src/app/main/ui/inspect/attributes/variant.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/variant.cljs @@ -11,8 +11,8 @@ [app.common.logic.variants :as clv] [app.common.types.component :as ctc] [app.common.types.components-list :as ctkl] - [app.main.ui.components.copy-button :refer [copy-button]] - [app.main.ui.components.title-bar :refer [inspect-title-bar]] + [app.main.ui.components.copy-button :refer [copy-button*]] + [app.main.ui.components.title-bar :refer [inspect-title-bar*]] [app.util.i18n :refer [tr]] [cuerdas.core :as str] [rumext.v2 :as mf])) @@ -23,12 +23,12 @@ :class (stl/css :variant-row)} [:div {:class (stl/css :global/attr-label)} name] [:div {:class (stl/css :global/attr-value)} - [:& copy-button {:data value} + [:> copy-button* {:data value} [:div {:class (stl/css :button-children)} value]]]]) (mf/defc variant-panel* - [{:keys [objects shapes libraries file-id] :as kk} ] + [{:keys [objects shapes libraries file-id] :as kk}] (let [shape (->> shapes first) title (cond (ctc/is-variant-container? shape) @@ -48,7 +48,7 @@ (->> (:variant-properties component) (map #(update % :value (fn [v] (if (str/blank? v) "--" v))))))))] [:div {:class (stl/css :attributes-block)} - [:& inspect-title-bar + [:> inspect-title-bar* {:title (tr title) :class (stl/css :title-spacing-variant)}] diff --git a/frontend/src/app/main/ui/inspect/code.cljs b/frontend/src/app/main/ui/inspect/code.cljs index dc56aa326..eaca3f114 100644 --- a/frontend/src/app/main/ui/inspect/code.cljs +++ b/frontend/src/app/main/ui/inspect/code.cljs @@ -18,7 +18,7 @@ [app.main.refs :as refs] [app.main.store :as st] [app.main.ui.components.code-block :refer [code-block]] - [app.main.ui.components.copy-button :refer [copy-button]] + [app.main.ui.components.copy-button :refer [copy-button*]] [app.main.ui.components.radio-buttons :refer [radio-button radio-buttons]] [app.main.ui.hooks.resize :refer [use-resize-hook]] [app.main.ui.icons :as i] @@ -293,9 +293,9 @@ :on-click on-expand} i/code] - [:& copy-button {:data copy-css-fn - :class (stl/css :css-copy-btn) - :on-copied on-style-copied}]]] + [:> copy-button* {:data copy-css-fn + :class (stl/css :css-copy-btn) + :on-copied on-style-copied}]]] (when-not collapsed-css? [:div {:class (stl/css :code-row-display) @@ -334,9 +334,9 @@ :on-click on-expand} i/code] - [:& copy-button {:data copy-html-fn - :class (stl/css :html-copy-btn) - :on-copied on-markup-copied}]]] + [:> copy-button* {:data copy-html-fn + :class (stl/css :html-copy-btn) + :on-copied on-markup-copied}]]] (when-not collapsed-markup? [:div {:class (stl/css :code-row-display)