Polish dropdown theme

day8 · Apr 22, 2024 · 0f9753f · 0f9753f
1 parent e48a05e
commit 0f9753f
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 5 deletions.
diff --git a/src/re_com/dropdown.cljs b/src/re_com/dropdown.cljs
@@ -19,7 +19,7 @@
 ;;  Inspiration: http://alxlit.name/bootstrap-chosen
 ;;  Alternative: http://silviomoreto.github.io/bootstrap-select
 
-(defn anchor [{:keys [label placeholder state theme]}]
+(defn anchor-part [{:keys [label placeholder state theme]}]
   [:a (theme/props {:state state :part ::anchor} theme)
    (or label placeholder "Select an item")])
 
@@ -149,7 +149,7 @@
                 {:src   (at)
                  :attr  {:ref      anchor-ref!
                          :on-click #(swap! model not)}
-                 :child [u/part anchor part-props re-com.dropdown/anchor]})]
+                 :child [u/part anchor part-props anchor-part]})]
              (when (= :open (:openable state))
                [body-wrapper {:anchor-ref      anchor-ref
                               :popover-ref     popover-ref

diff --git a/src/re_com/theme/default.cljs b/src/re_com/theme/default.cljs
@@ -159,9 +159,12 @@
                     :text-decoration  "none"
                     :white-space      "nowrap"
                     :transition       "border 0.2s box-shadow 0.2s"}})
-
+         
          ::dropdown/anchor
-         {:style (cond-> {:color (:foreground $)}
+         {:style (cond-> {:color (:foreground $)
+                          :overflow "hidden"
+                          :text-overflow "ellipsis"
+                          :white-space "nowrap"}
                    (-> state :enable (= :disabled))
                    (merge {:background-color (:background-disabled $)}))}
 

diff --git a/src/re_com/tree_select.cljs b/src/re_com/tree_select.cljs
@@ -419,7 +419,8 @@
                               (let [model (deref-or-value model)]
                                 [h-box
                                  (themed ::dropdown-anchor
-                                   {:style {:height height}
+                                   {:width width
+                                    :style {:height height}
                                     :children
                                     [(if-not (empty? model)
                                        label placeholder)