Icons (#6)

deprecate icons, add dom/set-attribute and dom/body

project.clj

@@ -1,4 +1,4 @@
-(defproject com.github.dgknght/app-lib "0.3.4"
+(defproject com.github.dgknght/app-lib "0.3.5"
   :description "Library of commonly used functions for web app development"
   :url "https://github.com/dgknght/app-lib"
   :license {:name "EPL-2.0 OR GPL-2.0-or-later WITH Classpath-exception-2.0"

src/cljc/dgknght/app_lib/bootstrap_icons.cljc

@@ -1,4 +1,6 @@
-(ns dgknght.app-lib.bootstrap-icons)
+(ns dgknght.app-lib.bootstrap-icons
+  "Do not use. Implement a project-specific strategy instead."
+  {:deprecated "0.3.5"})
 
 (def icons
   {:0-circle         [[:path {:d "M7.988 12.158c-1.851 0-2.941-1.57-2.941-3.99V7.84c0-2.408 1.101-3.996 2.965-3.996 1.857 0 2.935 1.57 2.935 3.996v.328c0 2.408-1.101 3.99-2.959 3.99ZM8 4.951c-1.008 0-1.629 1.09-1.629 2.895v.31c0 1.81.627 2.895 1.629 2.895s1.623-1.09 1.623-2.895v-.31c0-1.8-.621-2.895-1.623-2.895Z"}]
@@ -216,7 +218,7 @@
       apply-size
       apply-style))
 
-(defn icon
+(defn ^{:deprecated "0.3.5"} icon
   ([icon-key]
    (icon icon-key {}))
   ([icon-key options]
@@ -229,8 +231,7 @@
             elements)
      [:span.bg-danger options (str "Icon " (name icon-key) " not found")])))
 
-; TODO: this needs to be decorated or moved somewhere else
-(defn icon-with-text
+(defn ^{:deprecated "0.3.5"} icon-with-text
   [icon-key text]
   [:span.d-flex.align-items-center
    (icon icon-key)

src/cljs/dgknght/app_lib/api_async.cljs

@@ -88,9 +88,7 @@
                          request
                          (assoc :json-params resource)))))
 
-(defn path
-  [& segments]
-  (apply api/path segments))
+(def path api/path)
 
 (defn multipart-params
   [req params]

src/cljs/dgknght/app_lib/bootstrap_5.cljs

@@ -3,7 +3,8 @@
   (:require [clojure.string :as string]
             [dgknght.app-lib.inflection :refer [title-case]]
             [dgknght.app-lib.notifications :as notify]
-            [dgknght.app-lib.html :refer [add-classes]]
+            [dgknght.app-lib.html :refer [add-class
+                                          add-classes]]
             [dgknght.app-lib.core :as lib]
             [dgknght.app-lib.forms :as forms]
             [dgknght.app-lib.forms-validation :as v]
@@ -113,7 +114,7 @@
         :style {:max-width "32px"}
         :alt "Profile Photo"}])]])
 
-(def icon icons/icon)
+(def ^{:deprecated "0.3.5"} icon icons/icon)
 
 (defn spinner
   ([] (spinner {}))
@@ -192,7 +193,7 @@
                  :aria-label "Close"}
     (icons/icon :x)]])
 
-(defn icon-with-text
+(defn ^{:deprecated "0.3.5"} icon-with-text
   ([icon-key text] (icon-with-text icon-key text {:size :small}))
   ([icon-key text {:keys [size] :as options}]
    [:span.d-flex.align-items-center
@@ -202,7 +203,7 @@
     [:span.ms-1
      text]]))
 
-(defn busy-button
+(defn ^{:deprecated "0.3.5"} busy-button
   [{:keys [html caption icon busy? disabled?]
     :or {disabled? (atom false)}}]
   (fn []
@@ -248,6 +249,18 @@
   (add-classes elem (cond-> ["form-select"]
                       (seq errors) (conj "is-invalid"))))
 
+(defmethod forms/decorate [::forms/text ::forms/element ::bootstrap-5]
+  [elem model _field errors {:keys [prepend append]}]
+  (let [decorated (cond-> (add-class elem "form-control")
+                    (v/valid? model) (add-class "is-valid")
+                    (seq errors) (add-class "is-invalid"))]
+    (if (or prepend append)
+      [:div.input-group.mb-3 {:class (when (seq errors) "is-invalid")} ; adding is-invalid here triggers bootstraps invalid-feedback visbility
+       prepend
+       decorated
+       append]
+      decorated)))
+
 (defmethod forms/decorate [::forms/text ::forms/field ::bootstrap-5]
   [[_ attr :as elem] model field errors {:keys [hide?] :as options}]
   (let [inner-decorated (forms/decorate elem

src/cljs/dgknght/app_lib/dom.cljs

@@ -3,6 +3,9 @@
   (:require [dgknght.app-lib.client-macros :refer-macros [with-retry]]
             [goog.object :as obj]))
 
+(defn body []
+  (.-body js/document))
+
 (defn target
   [event]
   (.-target event))
@@ -76,6 +79,10 @@
       (obj/get "style")
       (obj/get k)))
 
+(defn set-attribute
+  [elem a-name a-value]
+  (.setAttribute elem a-name a-value))
+
 (defn debounce
   ([f] (debounce f 300))
   ([f timeout]

src/cljs/dgknght/app_lib/forms.cljs

@@ -388,7 +388,9 @@
    :parse-fn parse-date})
 
 (defn date-input
-  [model field options]
+  [model field {:as options
+                :keys [icon]
+                :or {icon (icons/icon :calendar {:size :small})}}]
   (let [ctl-state (r/atom {:calendar (cal/init {:first-day-of-week :sunday
                                                 :selected (get-in @model field)})})
         visible? (r/cursor ctl-state [:visible?])]
@@ -414,7 +416,7 @@
           {:append [:button.btn.btn-secondary
                     {:on-click #(swap! ctl-state update-in [:visible?] not)
                      :type :button}
-                    (icons/icon :calendar {:size :small})]
+                    icon]
            :on-key-down (fn [e]
                           (when (dom/ctrl-key? e)
                             (.preventDefault e)