diff --git a/frontend/src/app/main/ui/workspace/tokens/common.cljs b/frontend/src/app/main/ui/workspace/tokens/common.cljs index c720fdd1c..f9d5e7c5d 100644 --- a/frontend/src/app/main/ui/workspace/tokens/common.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/common.cljs @@ -7,6 +7,8 @@ (ns app.main.ui.workspace.tokens.common (:require-macros [app.main.style :as stl]) (:require + [app.common.data :as d] + [cuerdas.core :as str] [rumext.v2 :as mf])) ;; Helpers --------------------------------------------------------------------- @@ -20,6 +22,14 @@ [pos coll] (into (subvec coll 0 pos) (subvec coll (inc pos)))) +(defn camel-keys [m] + (->> m + (d/deep-mapm + (fn [[k v]] + (if (or (keyword? k) (string? k)) + [(keyword (str/camel (name k))) v] + [k v]))))) + ;; Components ------------------------------------------------------------------ (mf/defc labeled-input @@ -28,9 +38,10 @@ (let [input-props (cond-> input-props ;; Disable auto-complete on form fields for proprietary password managers ;; https://github.com/orgs/tokens-studio/projects/69/views/11?pane=issue&itemId=63724204 - (not auto-complete?) (assoc :data-1p-ignore true - :data-lpignore true - :autoComplete "off"))] + (not auto-complete?) (assoc "data-1p-ignore" true + "data-lpignore" true + :auto-complete "off") + :always camel-keys)] [:label {:class (stl/css :labeled-input)} [:span {:class (stl/css :label)} label] [:& :input input-props]])) diff --git a/frontend/src/app/main/ui/workspace/tokens/modal.cljs b/frontend/src/app/main/ui/workspace/tokens/modal.cljs index fba2c13b8..f5d71acfc 100644 --- a/frontend/src/app/main/ui/workspace/tokens/modal.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/modal.cljs @@ -84,19 +84,19 @@ :on-submit on-submit} [:div {:class (stl/css :token-rows)} [:& tokens.common/labeled-input {:label "Name" - :input-props {:defaultValue @name - :autoFocus true - :onChange on-update-name}}] + :input-props {:default-value @name + :auto-focus true + :on-change on-update-name}}] (for [[idx {:keys [type label]}] (d/enumerate @state)] [:* {:key (str "form-field-" idx)} (case type :box-shadow [:p "TODO BOX SHADOW"] [:& tokens.common/labeled-input {:label label - :input-props {:defaultValue @token-value - :onChange #(on-update-state-field idx %)}}])]) + :input-props {:default-value @token-value + :on-change #(on-update-state-field idx %)}}])]) [:& tokens.common/labeled-input {:label "Description" - :input-props {:defaultValue @description - :onChange #(on-update-description %)}}] + :input-props {:default-value @description + :on-change #(on-update-description %)}}] [:div {:class (stl/css :button-row)} [:button {:class (stl/css :button) :type "submit"}