tweak: augment quo input component to allow for styling of the input, the input container, and container

Author: seanstrom

src/quo/components/inputs/input/view.cljs

@@ -57,12 +57,12 @@
   "Custom properties that must be removed from properties map passed to InputText."
   [:type :blur? :error? :right-icon :left-icon :disabled? :small? :button
    :label :char-limit :on-char-limit-reach :icon-name :multiline? :on-focus :on-blur
-   :container-style :ref])
+   :container-style :input-container-style :input-style :ref])
 
 (defn- base-input
   [{:keys [blur? error? right-icon left-icon disabled? small? button
-           label char-limit multiline? clearable? on-focus on-blur container-style
-           on-change-text on-char-limit-reach weight default-value on-clear]
+           label char-limit multiline? clearable? on-focus on-blur container-style input-container-style
+           input-style on-change-text on-char-limit-reach weight default-value on-clear]
     :as   props}]
   (let [theme                  (quo.theme/use-theme-value)
         ref                    (rn/use-ref-atom nil)
@@ -115,15 +115,18 @@
          :label          label
          :current-chars  char-count
          :char-limit     char-limit}])
-     [rn/view {:style (style/input-container colors-by-status small? disabled?)}
+     [rn/view
+      {:style (merge (style/input-container colors-by-status small? disabled?) input-container-style)}
       (when-let [{:keys [icon-name]} left-icon]
         [left-accessory
          {:variant-colors variant-colors
           :small?         small?
           :icon-name      icon-name}])
       [rn/text-input
        (cond-> {:ref                    on-ref
-                :style                  (style/input colors-by-status small? multiple-lines? weight)
+                :style                  (merge
+                                         (style/input colors-by-status small? multiple-lines? weight)
+                                         input-style)
                 :accessibility-label    :input
                 :placeholder-text-color (:placeholder colors-by-status)
                 :keyboard-appearance    (quo.theme/theme-value :light :dark theme)