diff --git a/src/re_com/dropdown.cljs b/src/re_com/dropdown.cljs index 2858607f..3e6152a8 100644 --- a/src/re_com/dropdown.cljs +++ b/src/re_com/dropdown.cljs @@ -360,10 +360,12 @@ :exit (js/setTimeout (fn [] (reset! transitionable :out)) 50))) theme (theme/defaults args - {:user [(theme/<-props (merge args - (when anchor-height {:height anchor-height}) - (when width {:width width}) - (when anchor-width {:width anchor-width})) + {:user [(theme/<-props (-> args + (dissoc :height) + (merge + (when anchor-height {:height anchor-height}) + (when width {:width width}) + (when anchor-width {:width anchor-width}))) {:part ::anchor-wrapper :exclude [:max-height :min-height]}) (theme/<-props (merge args diff --git a/src/re_demo/dropdown.cljs b/src/re_demo/dropdown.cljs index 51478775..727f6a22 100644 --- a/src/re_demo/dropdown.cljs +++ b/src/re_demo/dropdown.cljs @@ -12,14 +12,16 @@ (defn panel* [] - (let [width (r/atom 200) - height (r/atom 200) - min-width (r/atom 200) - max-width (r/atom 200) - max-height (r/atom 200) - min-height (r/atom 200) - body-width (r/atom 200) - anchor-width (r/atom 200)] + (let [width (r/atom 200) + height (r/atom 200) + min-width (r/atom 200) + max-width (r/atom 200) + max-height (r/atom 200) + min-height (r/atom 200) + anchor-height (r/atom 200) + body-width (r/atom 200) + body-height (r/atom 200) + anchor-width (r/atom 200)] (fn [] [v-box :src (at) :size "auto" :gap "10px" :children @@ -52,6 +54,8 @@ :model model :width (some-> @width px)} (when @height {:height (px @height)}) + (when @anchor-height {:anchor-height (px @anchor-height)}) + (when @body-height {:body-height (px @body-height)}) {:min-width (some-> @min-width px) :max-width (some-> @max-width px) :max-height (some-> @max-height px) @@ -68,14 +72,17 @@ :children [[title3 "Interactive Parameters" {:margin-top "0"}] [v-box :src (at) :gap "20px" - :children [[prop-slider {:prop width :id :width :default 212 :default-on? false}] - [prop-slider {:prop height :id :height :default 212 :default-on? false}] - [prop-slider {:prop min-width :id :min-width :default 212 :default-on? false}] - [prop-slider {:prop max-width :id :max-width :default 212 :default-on? false}] - [prop-slider {:prop min-height :id :min-height :default 212 :default-on? false}] - [prop-slider {:prop max-height :id :max-height :default 212 :default-on? false}] - [prop-slider {:prop body-width :id :body-width :default 212 :default-on? false}] - [prop-slider {:prop anchor-width :id :anchor-width :default 212 :default-on? false}]]]]]]]]] + :children + [[prop-slider {:prop width :id :width :default 212 :default-on? false}] + [prop-slider {:prop height :id :height :default 212 :default-on? false}] + [prop-slider {:prop min-width :id :min-width :default 212 :default-on? false}] + [prop-slider {:prop max-width :id :max-width :default 212 :default-on? false}] + [prop-slider {:prop min-height :id :min-height :default 212 :default-on? false}] + [prop-slider {:prop max-height :id :max-height :default 212 :default-on? false}] + [prop-slider {:prop body-width :id :body-width :default 212 :default-on? false}] + [prop-slider {:prop body-height :id :body-height :default 212 :default-on? false}] + [prop-slider {:prop anchor-height :id :anchor-height :default 35 :default-on? false :min 10 :max 50}] + [prop-slider {:prop anchor-width :id :anchor-width :default 212 :default-on? false}]]]]]]]]] [parts-table "dropdown" dropdown-parts-desc]]]))) ;; core holds a reference to panel, so need one level of indirection to get figwheel updates diff --git a/src/re_demo/utils.cljs b/src/re_demo/utils.cljs index 857c1b1e..178919f6 100644 --- a/src/re_demo/utils.cljs +++ b/src/re_demo/utils.cljs @@ -216,7 +216,7 @@ [element] (set! (.-scrollTop element) 0)) -(defn prop-slider [{:keys [prop default default-on? id] :or {default-on? true}}] +(defn prop-slider [{:keys [prop default default-on? id min max] :or {default-on? true min 40 max 500}}] (let [default (or @prop default)] (when (and default-on? default) (reset! prop default)) @@ -239,8 +239,8 @@ [rc/slider :model prop :on-change #(reset! prop %) - :min 50 - :max 400 + :min min + :max max :step 1 :width "300px"] [gap :src (at) :size "5px"]