-
Notifications
You must be signed in to change notification settings - Fork 982
/
information_box.cljs
65 lines (62 loc) · 2.14 KB
/
information_box.cljs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
(ns status-im2.contexts.quo-preview.info.information-box
(:require [quo2.core :as quo]
[quo2.foundations.colors :as colors]
[react-native.core :as rn]
[reagent.core :as reagent]
[status-im2.contexts.quo-preview.preview :as preview]))
(def descriptor
[{:label "Type:"
:key :type
:type :select
:options [{:key :default
:value "Default"}
{:key :informative
:value "Informative"}
{:key :error
:value "Error"}]}
{:label "Closable?"
:key :closable?
:type :boolean}
{:label "Message"
:key :message
:type :text}
{:label "Button Label"
:key :button-label
:type :text}])
(defn cool-preview
[]
(let [state (reagent/atom
{:type :default
:closable? true
:message (str "If you registered a stateofus.eth name "
"you might be eligible to connect $ENS")
:button-label "Button"})
closable? (reagent/cursor state [:closable?])
closed? (reagent/cursor state [:closed?])
on-close (fn []
(reset! closed? true)
(js/setTimeout (fn [] (reset! closed? false))
2000))]
(fn []
[rn/touchable-without-feedback {:on-press rn/dismiss-keyboard!}
[rn/view
[preview/customizer state descriptor]
[rn/view
{:style {:padding-vertical 20
:align-items :center}}
[quo/information-box
(merge {:icon :i/info
:style {:width 335}
:on-close (when @closable? on-close)}
@state)
(:message @state)]]]])))
(defn preview-information-box
[]
[rn/view
{:background-color (colors/theme-colors colors/white colors/neutral-90)
:flex 1}
[rn/flat-list
{:flex 1
:keyboard-should-persist-taps :always
:header [cool-preview]
:key-fn str}]])