1
1
import idom
2
- from idom import html
3
2
from test_app .models import TodoItem
4
3
5
4
import django_idom
8
7
9
8
@idom .component
10
9
def hello_world ():
11
- return html .h1 ({"id" : "hello-world" }, "Hello World!" )
10
+ return idom . html .h1 ({"id" : "hello-world" }, "Hello World!" )
12
11
13
12
14
13
@idom .component
15
14
def button ():
16
15
count , set_count = idom .hooks .use_state (0 )
17
- return html .div (
18
- html .button (
16
+ return idom . html .div (
17
+ idom . html .button (
19
18
{"id" : "counter-inc" , "onClick" : lambda event : set_count (count + 1 )},
20
19
"Click me!" ,
21
20
),
22
- html .p (
21
+ idom . html .p (
23
22
{"id" : "counter-num" , "data-count" : count },
24
23
f"Current count is: { count } " ,
25
24
),
@@ -29,7 +28,7 @@ def button():
29
28
@idom .component
30
29
def parameterized_component (x , y ):
31
30
total = x + y
32
- return html .h1 ({"id" : "parametrized-component" , "data-value" : total }, total )
31
+ return idom . html .h1 ({"id" : "parametrized-component" , "data-value" : total }, total )
33
32
34
33
35
34
victory = idom .web .module_from_template ("react" , "victory-bar" , fallback = "..." )
@@ -46,90 +45,90 @@ def use_websocket():
46
45
ws = django_idom .hooks .use_websocket ()
47
46
ws .scope = "..."
48
47
success = bool (ws .scope and ws .close and ws .disconnect and ws .view_id )
49
- return html .div (
48
+ return idom . html .div (
50
49
{"id" : "use-websocket" , "data-success" : success },
51
- html .hr (),
50
+ idom . html .hr (),
52
51
f"use_websocket: { ws } " ,
53
- html .hr (),
52
+ idom . html .hr (),
54
53
)
55
54
56
55
57
56
@idom .component
58
57
def use_scope ():
59
58
scope = django_idom .hooks .use_scope ()
60
59
success = len (scope ) >= 10 and scope ["type" ] == "websocket"
61
- return html .div (
60
+ return idom . html .div (
62
61
{"id" : "use-scope" , "data-success" : success },
63
62
f"use_scope: { scope } " ,
64
- html .hr (),
63
+ idom . html .hr (),
65
64
)
66
65
67
66
68
67
@idom .component
69
68
def use_location ():
70
69
location = django_idom .hooks .use_location ()
71
70
success = bool (location )
72
- return html .div (
71
+ return idom . html .div (
73
72
{"id" : "use-location" , "data-success" : success },
74
73
f"use_location: { location } " ,
75
- html .hr (),
74
+ idom . html .hr (),
76
75
)
77
76
78
77
79
78
@idom .component
80
79
def django_css ():
81
- return html .div (
80
+ return idom . html .div (
82
81
{"id" : "django-css" },
83
82
django_idom .components .django_css ("django-css-test.css" ),
84
- html .div ({"style" : {"display" : "inline" }}, "django_css: " ),
85
- html .button ("This text should be blue." ),
86
- html .hr (),
83
+ idom . html .div ({"style" : {"display" : "inline" }}, "django_css: " ),
84
+ idom . html .button ("This text should be blue." ),
85
+ idom . html .hr (),
87
86
)
88
87
89
88
90
89
@idom .component
91
90
def django_js ():
92
91
success = False
93
- return html ._ (
94
- html .div (
92
+ return idom . html ._ (
93
+ idom . html .div (
95
94
{"id" : "django-js" , "data-success" : success },
96
95
f"django_js: { success } " ,
97
96
django_idom .components .django_js ("django-js-test.js" ),
98
97
),
99
- html .hr (),
98
+ idom . html .hr (),
100
99
)
101
100
102
101
103
102
@idom .component
104
103
@django_idom .decorators .auth_required (
105
- fallback = html .div (
104
+ fallback = idom . html .div (
106
105
{"id" : "unauthorized-user-fallback" },
107
106
"unauthorized_user: Success" ,
108
- html .hr (),
107
+ idom . html .hr (),
109
108
)
110
109
)
111
110
def unauthorized_user ():
112
- return html .div (
111
+ return idom . html .div (
113
112
{"id" : "unauthorized-user" },
114
113
"unauthorized_user: Fail" ,
115
- html .hr (),
114
+ idom . html .hr (),
116
115
)
117
116
118
117
119
118
@idom .component
120
119
@django_idom .decorators .auth_required (
121
120
auth_attribute = "is_anonymous" ,
122
- fallback = html .div (
121
+ fallback = idom . html .div (
123
122
{"id" : "authorized-user-fallback" },
124
123
"authorized_user: Fail" ,
125
- html .hr (),
124
+ idom . html .hr (),
126
125
),
127
126
)
128
127
def authorized_user ():
129
- return html .div (
128
+ return idom . html .div (
130
129
{"id" : "authorized-user" },
131
130
"authorized_user: Success" ,
132
- html .hr (),
131
+ idom . html .hr (),
133
132
)
134
133
135
134
@@ -161,23 +160,23 @@ def todo_list():
161
160
toggle_item = use_mutation (toggle_item_mutation , refetch = get_items_query )
162
161
163
162
if items .error :
164
- rendered_items = html .h2 (f"Error when loading - { items .error } " )
163
+ rendered_items = idom . html .h2 (f"Error when loading - { items .error } " )
165
164
elif items .data is None :
166
- rendered_items = html .h2 ("Loading..." )
165
+ rendered_items = idom . html .h2 ("Loading..." )
167
166
else :
168
- rendered_items = html ._ (
169
- html .h3 ("Not Done" ),
167
+ rendered_items = idom . html ._ (
168
+ idom . html .h3 ("Not Done" ),
170
169
_render_items ([i for i in items .data if not i .done ], toggle_item ),
171
- html .h3 ("Done" ),
170
+ idom . html .h3 ("Done" ),
172
171
_render_items ([i for i in items .data if i .done ], toggle_item ),
173
172
)
174
173
175
174
add_item = use_mutation (add_item_mutation , refetch = get_items_query )
176
175
177
176
if add_item .loading :
178
- mutation_status = html .h2 ("Working..." )
177
+ mutation_status = idom . html .h2 ("Working..." )
179
178
elif add_item .error :
180
- mutation_status = html .h2 (f"Error when adding - { add_item .error } " )
179
+ mutation_status = idom . html .h2 (f"Error when adding - { add_item .error } " )
181
180
else :
182
181
mutation_status = ""
183
182
@@ -189,9 +188,9 @@ def on_submit(event):
189
188
def on_change (event ):
190
189
set_input_value (event ["target" ]["value" ])
191
190
192
- return html .div (
193
- html .label ("Add an item:" ),
194
- html .input (
191
+ return idom . html .div (
192
+ idom . html .label ("Add an item:" ),
193
+ idom . html .input (
195
194
{
196
195
"type" : "text" ,
197
196
"id" : "todo-input" ,
@@ -206,12 +205,12 @@ def on_change(event):
206
205
207
206
208
207
def _render_items (items , toggle_item ):
209
- return html .ul (
208
+ return idom . html .ul (
210
209
[
211
- html .li (
210
+ idom . html .li (
212
211
{"id" : f"todo-item-{ item .text } " },
213
212
item .text ,
214
- html .input (
213
+ idom . html .input (
215
214
{
216
215
"id" : f"todo-item-{ item .text } -checkbox" ,
217
216
"type" : "checkbox" ,
0 commit comments