Merge branch 'release/0.7.0-alpha1'

day8 · Oct 15, 2015 · bb062d3 · bb062d3
2 parents bf0107c + 4e1eafe
commit bb062d3
Show file tree

Hide file tree

Showing 6 changed files with 97 additions and 90 deletions.
diff --git a/project.clj b/project.clj
@@ -4,7 +4,7 @@
 
 ;; ---------------------------------------------------------------------------------------
 
-(defproject         re-com "0.6.2"
+(defproject         re-com "0.7.0-alpha1"
   :description      "Reusable UI components for Reagent"
   :url              "https://github.com/Day8/re-com.git"
   :license          {:name "MIT"}

diff --git a/src/re_com/datepicker.cljs b/src/re_com/datepicker.cljs
@@ -8,7 +8,7 @@
     [cljs-time.format     :refer [parse unparse formatters formatter]]
     [re-com.box           :refer [border h-box flex-child-style]]
     [re-com.util          :refer [deref-or-value now->utc]]
-    [re-com.popover       :refer [popover-anchor-wrapper backdrop popover-border]]))
+    [re-com.popover       :refer [popover-anchor-wrapper popover-content-wrapper]]))
 
 ;; Loosely based on ideas: https://github.com/dangrossman/bootstrap-daterangepicker
 
@@ -248,7 +248,7 @@
   {:pre [(validate-args-macro datepicker-dropdown-args-desc args "datepicker-dropdown")]}
   (let [shown?         (reagent/atom false)
         cancel-popover #(reset! shown? false)
-        position       :below-center]
+        position       :below-left]
     (fn
       [& {:keys [model show-weeks? on-change format] :as passthrough-args}]
       (let [collapse-on-select (fn [new-model]
@@ -263,13 +263,13 @@
          :showing? shown?
          :position position
          :anchor   [anchor-button shown? model format]
-         :popover  [:div {:style (flex-child-style "inherit")}
-                    (when shown? [backdrop :on-click cancel-popover])
-                    [popover-border
-                     :position     position
-                     :arrow-length 0
-                     :arrow-width  0
-                     :margin-left  (if show-weeks? "-50px" "-36px") ; Align right edge to activation button.
-                     :margin-top   "3px"
-                     :padding      "0px"
-                     :children     [(into [datepicker] passthrough-args)]]]]))))
+         :popover  [popover-content-wrapper
+                    :showing?        shown?
+                    :position        position
+                    :position-offset (if show-weeks? 43 44)
+                    :arrow-length    0
+                    :arrow-width     0
+                    :arrow-gap       3
+                    :padding         "0px"
+                    :on-cancel       cancel-popover
+                    :body            (into [datepicker] passthrough-args)]]))))
diff --git a/src/re_com/dropdown.cljs b/src/re_com/dropdown.cljs
@@ -190,12 +190,12 @@
 ;;--------------------------------------------------------------------------------------------------
 
 (def single-dropdown-args-desc
-  [{:name :choices       :required true                   :type "vector of choices | atom"      :validate-fn vector?           :description [:span "Each is expected to have an id, label and, optionally, a group, provided by " [:code ":id-fn"] ", " [:code ":label-fn"] " & " [:code ":group-fn"]]}
+  [{:name :choices       :required true                   :type "vector of choices | atom"      :validate-fn vector-of-maps?   :description [:span "Each is expected to have an id, label and, optionally, a group, provided by " [:code ":id-fn"] ", " [:code ":label-fn"] " & " [:code ":group-fn"]]}
+   {:name :model         :required true                   :type "the id of a choice | atom"                                    :description [:span "the id of the selected choice. If nil, " [:code ":placeholder"] " text is shown"]}
+   {:name :on-change     :required true                   :type "id -> nil"                     :validate-fn fn?               :description [:span "called when a new choice is selected. Passed the id of new choice"] }
    {:name :id-fn         :required false :default :id     :type "choice -> anything"            :validate-fn ifn?              :description [:span "given an element of " [:code ":choices"] ", returns its unique identifier (aka id)"]}
    {:name :label-fn      :required false :default :label  :type "choice -> string | hiccup"     :validate-fn ifn?              :description [:span "given an element of " [:code ":choices"] ", returns its displayable label"]}
    {:name :group-fn      :required false :default :group  :type "choice -> anything"            :validate-fn ifn?              :description [:span "given an element of " [:code ":choices"] ", returns its group identifier"]}
-   {:name :model         :required true                   :type "the id of a choice | atom"                                    :description [:span "the id of the selected choice. If nil, " [:code ":placeholder"] " text is shown"]}
-   {:name :on-change     :required true                   :type "id -> nil"                     :validate-fn fn?               :description [:span "called when a new choice is selected. Passed the id of new choice"] }
    {:name :disabled?     :required false :default false   :type "boolean | atom"                                               :description "if true, no user selection is allowed"}
    {:name :filter-box?   :required false :default false   :type "boolean"                                                      :description "if true, a filter text field is placed at the top of the dropdown"}
    {:name :regex-filter? :required false :default false   :type "boolean | atom"                                               :description "if true, the filter text field will support JavaScript regular expressions. If false, just plain text"}