[#19265] fix: cursor overlapping placeholder in android (#19526)

This commit is contained in:
Mohsen 2024-04-05 15:25:33 +03:00 committed by GitHub
parent 9ba6c6262e
commit f8699c582a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -60,12 +60,12 @@
"Custom properties that must be removed from properties map passed to InputText." "Custom properties that must be removed from properties map passed to InputText."
[:type :blur? :error? :right-icon :left-icon :disabled? :small? :button [:type :blur? :error? :right-icon :left-icon :disabled? :small? :button
:label :char-limit :on-char-limit-reach :icon-name :multiline? :on-focus :on-blur :label :char-limit :on-char-limit-reach :icon-name :multiline? :on-focus :on-blur
:container-style :input-container-style :ref]) :container-style :input-container-style :ref :placeholder])
(defn- base-input (defn- base-input
[{:keys [blur? error? right-icon left-icon disabled? small? button [{:keys [blur? error? right-icon left-icon disabled? small? button
label char-limit multiline? clearable? on-focus on-blur container-style input-container-style label char-limit multiline? clearable? on-focus on-blur container-style input-container-style
on-change-text on-char-limit-reach weight default-value on-clear] on-change-text on-char-limit-reach weight default-value on-clear placeholder]
:as props}] :as props}]
(let [theme (quo.theme/use-theme-value) (let [theme (quo.theme/use-theme-value)
ref (rn/use-ref-atom nil) ref (rn/use-ref-atom nil)
@ -110,7 +110,10 @@
{:style-fn style/clear-icon {:style-fn style/clear-icon
:icon-name :i/clear :icon-name :i/clear
:on-press clear-on-press})) :on-press clear-on-press}))
clean-props (apply dissoc props custom-props)] clean-props (apply dissoc props custom-props)
;; Workaround for android cursor overlapping placeholder
;; https://github.com/facebook/react-native/issues/27687
modified-placeholder (if platform/android? (str "\u2009" placeholder) placeholder)]
[rn/view {:style container-style} [rn/view {:style container-style}
(when (or label char-limit) (when (or label char-limit)
[label-&-counter [label-&-counter
@ -134,6 +137,7 @@
:keyboard-appearance (quo.theme/theme-value :light :dark theme) :keyboard-appearance (quo.theme/theme-value :light :dark theme)
:cursor-color (:cursor variant-colors) :cursor-color (:cursor variant-colors)
:editable (not disabled?) :editable (not disabled?)
:placeholder modified-placeholder
:on-focus (fn [] :on-focus (fn []
(when on-focus (on-focus)) (when on-focus (on-focus))
(internal-on-focus)) (internal-on-focus))