mirror of https://github.com/status-im/reagent.git
21 lines
948 B
Markdown
21 lines
948 B
Markdown
|
# Smooth UI
|
||
|
|
|
||
|
|
Smooth UI has the same problem with [controlled inputs](../CotrolledInputs.md)
|
||
|
|
as [Material UI](./material-ui.md).
|
||
|
|
The problem can be solved by providing custom component to Smooth UI inputs
|
||
|
|
which will create the Input element using Reagent, enabling Reagent to use
|
||
|
|
it's workaround logic to control input value and cursor position:
|
||
|
|
|
||
|
|
```cljs
|
||
|
|
(def r-input (r/reactify-component
|
||
|
|
(fn [props]
|
||
|
|
;; Omit:
|
||
|
|
; https://github.com/smooth-code/smooth-ui/blob/c5f3c75a438a04e766dbedeafc2be54252a5338e/packages/shared/core/createComponent.js#L31
|
||
|
|
; https://github.com/smooth-code/ smooth-ui/blob/c5f3c75a438a04e766dbedeafc2be54252a5338e/packages/shared/core/Input.js#L84
|
||
|
|
;; Maybe also:
|
||
|
|
; (.. system -meta -props)
|
||
|
|
[:input (dissoc props :__scTheme :theme :control :size :valid)])))
|
||
|
|
|
||
|
|
(r/render [:> Input {:as r-input ...}] container)
|
||
|
|
```
|