File size: 28,486 Bytes
e9a5438
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
<!doctype html>
<html lang="en" style="
		margin: 0;
		padding: 0;
		min-height: 100%;
		display: flex;
		flex-direction: column;
	">
    <head>
        <meta charset="utf-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
        <style>
            :root {
                --bg: #f1f5f9;
                --col: #0f0f11;
                --bg-dark: #0f172a;
                --col-dark: #e4e4e7;
            }

            body {
                background: var(--bg);
                color: var(--col);
                font-family: Arial, Helvetica, sans-serif;
            }

            @media (prefers-color-scheme: dark) {
                body {
                    background: var(--bg-dark);
                    color: var(--col-dark);
                }
            }
        </style>
        <meta property="og:url" content="https://gradio.app/"/>
        <meta property="og:type" content="website"/>
        <meta property="og:image" content=""/>
        <meta property="og:title" content="🤖AI ChatBot"/>
        <meta property="og:description" content=""/>
        <meta name="twitter:card" content="summary_large_image"/>
        <meta name="twitter:creator" content="@teamGradio"/>
        <meta name="twitter:title" content="🤖AI ChatBot"/>
        <meta name="twitter:description" content=""/>
        <meta name="twitter:image" content=""/>
        <script data-gradio-mode>
            window.__gradio_mode__ = "app";
            window.iFrameResizer = {
                heightCalculationMethod: "taggedElement"
            };
            window.parent?.postMessage({
                type: "SET_SCROLLING",
                enabled: false
            }, "*");
        </script>
        <script>
            window.gradio_config = {
                "version": "4.36.0",
                "mode": "interface",
                "app_id": 8368150239980630295,
                "dev_mode": false,
                "analytics_enabled": true,
                "components": [{
                    "id": 4,
                    "type": "markdown",
                    "props": {
                        "value": "\u003ch1 style=\u0027text-align: center; margin-bottom: 1rem\u0027\u003e🤖AI ChatBot\u003c/h1\u003e",
                        "show_label": true,
                        "rtl": false,
                        "latex_delimiters": [{
                            "left": "$$",
                            "right": "$$",
                            "display": true
                        }],
                        "visible": true,
                        "elem_classes": [],
                        "sanitize_html": true,
                        "line_breaks": false,
                        "header_links": false,
                        "name": "markdown",
                        "_selectable": false
                    },
                    "skip_api": false,
                    "component_class_id": "0f35515b9a3362b42bb6721c836157a0",
                    "key": null,
                    "api_info": {
                        "type": "string"
                    },
                    "example_inputs": "# Hello!"
                }, {
                    "id": 5,
                    "type": "markdown",
                    "props": {
                        "value": "Building open-domain chatbots is a challenging area for machine learning research.",
                        "show_label": true,
                        "rtl": false,
                        "latex_delimiters": [{
                            "left": "$$",
                            "right": "$$",
                            "display": true
                        }],
                        "visible": true,
                        "elem_classes": [],
                        "sanitize_html": true,
                        "line_breaks": false,
                        "header_links": false,
                        "name": "markdown",
                        "_selectable": false
                    },
                    "skip_api": false,
                    "component_class_id": "0f35515b9a3362b42bb6721c836157a0",
                    "key": null,
                    "api_info": {
                        "type": "string"
                    },
                    "example_inputs": "# Hello!"
                }, {
                    "id": 6,
                    "type": "row",
                    "props": {
                        "variant": "default",
                        "visible": true,
                        "equal_height": false,
                        "show_progress": false,
                        "name": "row"
                    },
                    "skip_api": true,
                    "component_class_id": "b5cf3d15e2293fb5ccc071d7b8d69f64",
                    "key": null
                }, {
                    "id": 7,
                    "type": "column",
                    "props": {
                        "scale": 1,
                        "min_width": 320,
                        "variant": "panel",
                        "visible": true,
                        "show_progress": false,
                        "name": "column"
                    },
                    "skip_api": true,
                    "component_class_id": "214e3d6261b9edacc5d34ea4e8655821",
                    "key": null
                }, {
                    "id": 8,
                    "type": "column",
                    "props": {
                        "scale": 1,
                        "min_width": 320,
                        "variant": "default",
                        "visible": true,
                        "show_progress": false,
                        "name": "column"
                    },
                    "skip_api": true,
                    "component_class_id": "214e3d6261b9edacc5d34ea4e8655821",
                    "key": null
                }, {
                    "id": 2,
                    "type": "textbox",
                    "props": {
                        "lines": 1,
                        "max_lines": 20,
                        "label": "input",
                        "show_label": true,
                        "container": true,
                        "min_width": 160,
                        "visible": true,
                        "autofocus": false,
                        "autoscroll": true,
                        "elem_classes": [],
                        "type": "text",
                        "rtl": false,
                        "show_copy_button": false,
                        "name": "textbox",
                        "_selectable": false
                    },
                    "skip_api": false,
                    "component_class_id": "d0491bb0fbd427bdb2a4549c4d1ac869",
                    "key": null,
                    "api_info": {
                        "type": "string"
                    },
                    "example_inputs": "Hello!!"
                }, {
                    "id": 1,
                    "type": "state",
                    "props": {
                        "value": [],
                        "time_to_live": null,
                        "delete_callback": "\u003cfunction State.__init__.\u003clocals\u003e.\u003clambda\u003e at 0x7f27c976bf40\u003e",
                        "name": "state",
                        "_selectable": false
                    },
                    "skip_api": true,
                    "component_class_id": "52234f8c5f6f16893853acd5e503a8a8",
                    "key": null
                }, {
                    "id": 9,
                    "type": "form",
                    "props": {
                        "scale": 0,
                        "min_width": 0,
                        "name": "form"
                    },
                    "skip_api": true,
                    "component_class_id": "43cda85c6ff7a5dd8f83d29496b014ee",
                    "key": null
                }, {
                    "id": 10,
                    "type": "row",
                    "props": {
                        "variant": "default",
                        "visible": true,
                        "equal_height": true,
                        "show_progress": false,
                        "name": "row"
                    },
                    "skip_api": true,
                    "component_class_id": "b5cf3d15e2293fb5ccc071d7b8d69f64",
                    "key": null
                }, {
                    "id": 11,
                    "type": "button",
                    "props": {
                        "value": "Clear",
                        "variant": "secondary",
                        "visible": true,
                        "interactive": true,
                        "elem_classes": [],
                        "show_api": false,
                        "name": "button",
                        "_selectable": false
                    },
                    "skip_api": true,
                    "component_class_id": "683b6fcca448a942c7223d23f966c51f",
                    "key": null
                }, {
                    "id": 12,
                    "type": "button",
                    "props": {
                        "value": "Submit",
                        "variant": "primary",
                        "visible": true,
                        "interactive": true,
                        "elem_classes": [],
                        "name": "button",
                        "_selectable": false
                    },
                    "skip_api": true,
                    "component_class_id": "43ff9969f0bf4553b77ca8dc5b4850bc",
                    "key": null
                }, {
                    "id": 13,
                    "type": "column",
                    "props": {
                        "scale": 1,
                        "min_width": 320,
                        "variant": "panel",
                        "visible": true,
                        "show_progress": false,
                        "name": "column"
                    },
                    "skip_api": true,
                    "component_class_id": "214e3d6261b9edacc5d34ea4e8655821",
                    "key": null
                }, {
                    "id": 3,
                    "type": "chatbot",
                    "props": {
                        "likeable": false,
                        "value": [],
                        "label": "output 0",
                        "show_label": true,
                        "container": true,
                        "min_width": 160,
                        "visible": true,
                        "elem_classes": [],
                        "latex_delimiters": [{
                            "left": "$$",
                            "right": "$$",
                            "display": true
                        }],
                        "rtl": false,
                        "show_share_button": true,
                        "show_copy_button": false,
                        "avatar_images": [null, null],
                        "sanitize_html": true,
                        "render_markdown": true,
                        "bubble_full_width": true,
                        "line_breaks": true,
                        "name": "chatbot",
                        "_selectable": false
                    },
                    "skip_api": false,
                    "component_class_id": "f5586b71f64ccd6eb7f4bfd6c1e91abb",
                    "key": null,
                    "api_info": {
                        "$defs": {
                            "FileData": {
                                "properties": {
                                    "path": {
                                        "title": "Path",
                                        "type": "string"
                                    },
                                    "url": {
                                        "anyOf": [{
                                            "type": "string"
                                        }, {
                                            "type": "null"
                                        }],
                                        "default": null,
                                        "title": "Url"
                                    },
                                    "size": {
                                        "anyOf": [{
                                            "type": "integer"
                                        }, {
                                            "type": "null"
                                        }],
                                        "default": null,
                                        "title": "Size"
                                    },
                                    "orig_name": {
                                        "anyOf": [{
                                            "type": "string"
                                        }, {
                                            "type": "null"
                                        }],
                                        "default": null,
                                        "title": "Orig Name"
                                    },
                                    "mime_type": {
                                        "anyOf": [{
                                            "type": "string"
                                        }, {
                                            "type": "null"
                                        }],
                                        "default": null,
                                        "title": "Mime Type"
                                    },
                                    "is_stream": {
                                        "default": false,
                                        "title": "Is Stream",
                                        "type": "boolean"
                                    },
                                    "meta": {
                                        "default": {
                                            "_type": "gradio.FileData"
                                        },
                                        "title": "Meta",
                                        "type": "object"
                                    }
                                },
                                "required": ["path"],
                                "title": "FileData",
                                "type": "object"
                            },
                            "FileMessage": {
                                "properties": {
                                    "file": {
                                        "$ref": "#/$defs/FileData"
                                    },
                                    "alt_text": {
                                        "anyOf": [{
                                            "type": "string"
                                        }, {
                                            "type": "null"
                                        }],
                                        "default": null,
                                        "title": "Alt Text"
                                    }
                                },
                                "required": ["file"],
                                "title": "FileMessage",
                                "type": "object"
                            }
                        },
                        "items": {
                            "maxItems": 2,
                            "minItems": 2,
                            "prefixItems": [{
                                "anyOf": [{
                                    "type": "string"
                                }, {
                                    "$ref": "#/$defs/FileMessage"
                                }, {
                                    "type": "null"
                                }]
                            }, {
                                "anyOf": [{
                                    "type": "string"
                                }, {
                                    "$ref": "#/$defs/FileMessage"
                                }, {
                                    "type": "null"
                                }]
                            }],
                            "type": "array"
                        },
                        "title": "ChatbotData",
                        "type": "array"
                    },
                    "example_inputs": [["Hello!", null]]
                }, {
                    "id": 14,
                    "type": "row",
                    "props": {
                        "variant": "default",
                        "visible": true,
                        "equal_height": true,
                        "show_progress": false,
                        "name": "row"
                    },
                    "skip_api": true,
                    "component_class_id": "b5cf3d15e2293fb5ccc071d7b8d69f64",
                    "key": null
                }, {
                    "id": 15,
                    "type": "dataset",
                    "props": {
                        "component_props": [{
                            "lines": 1,
                            "max_lines": 20,
                            "placeholder": null,
                            "label": "input",
                            "info": null,
                            "show_label": true,
                            "container": true,
                            "scale": null,
                            "min_width": 160,
                            "interactive": null,
                            "visible": true,
                            "elem_id": null,
                            "autofocus": false,
                            "autoscroll": true,
                            "elem_classes": [],
                            "key": null,
                            "type": "text",
                            "text_align": null,
                            "rtl": false,
                            "show_copy_button": false
                        }],
                        "samples": [["How are you?"]],
                        "headers": ["input"],
                        "type": "index",
                        "samples_per_page": 10,
                        "visible": true,
                        "elem_classes": [],
                        "container": true,
                        "min_width": 160,
                        "name": "dataset",
                        "_selectable": false,
                        "components": ["textbox"],
                        "component_ids": [2]
                    },
                    "skip_api": false,
                    "component_class_id": "c72c93119b395a3f608fa8223dcae838",
                    "key": null,
                    "api_info": {
                        "type": "integer",
                        "description": "index of selected example"
                    },
                    "example_inputs": 0
                }],
                "css": null,
                "connect_heartbeat": true,
                "js": null,
                "head": null,
                "title": "🤖AI ChatBot",
                "space_id": "kingabzpro/AI-ChatBot",
                "enable_queue": true,
                "show_error": false,
                "show_api": true,
                "is_colab": false,
                "max_file_size": null,
                "stylesheets": ["https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@400;600\u0026display=swap", "https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@400;600\u0026display=swap"],
                "theme": "finlaymacklon/boxy_violet",
                "protocol": "sse_v3",
                "body_css": {
                    "body_background_fill": "#f1f5f9",
                    "body_text_color": "#0f0f11",
                    "body_background_fill_dark": "#0f172a",
                    "body_text_color_dark": "#e4e4e7"
                },
                "fill_height": false,
                "layout": {
                    "id": 0,
                    "children": [{
                        "id": 4
                    }, {
                        "id": 5
                    }, {
                        "id": 6,
                        "children": [{
                            "id": 7,
                            "children": [{
                                "id": 8,
                                "children": [{
                                    "id": 9,
                                    "children": [{
                                        "id": 2
                                    }]
                                }, {
                                    "id": 1
                                }]
                            }, {
                                "id": 10,
                                "children": [{
                                    "id": 11
                                }, {
                                    "id": 12
                                }]
                            }]
                        }, {
                            "id": 13,
                            "children": [{
                                "id": 3
                            }, {
                                "id": 14,
                                "children": []
                            }]
                        }]
                    }, {
                        "id": 15
                    }]
                },
                "dependencies": [{
                    "id": 0,
                    "targets": [[12, "click"], [2, "submit"]],
                    "inputs": [2, 1],
                    "outputs": [3, 1],
                    "backend_fn": true,
                    "js": null,
                    "queue": true,
                    "api_name": "predict",
                    "scroll_to_output": false,
                    "show_progress": "full",
                    "every": null,
                    "batch": false,
                    "max_batch_size": 4,
                    "cancels": [],
                    "types": {
                        "continuous": false,
                        "generator": false,
                        "cancel": false
                    },
                    "collects_event_data": false,
                    "trigger_after": null,
                    "trigger_only_on_success": false,
                    "trigger_mode": "once",
                    "show_api": true,
                    "zerogpu": false,
                    "rendered_in": null
                }, {
                    "id": 1,
                    "targets": [[11, "click"]],
                    "inputs": [],
                    "outputs": [2, 1, 3, 1],
                    "backend_fn": false,
                    "js": "() =\u003e [null, null, [], null]",
                    "queue": false,
                    "api_name": "js_fn",
                    "scroll_to_output": false,
                    "show_progress": "full",
                    "every": null,
                    "batch": false,
                    "max_batch_size": 4,
                    "cancels": [],
                    "types": {
                        "continuous": false,
                        "generator": false,
                        "cancel": false
                    },
                    "collects_event_data": false,
                    "trigger_after": null,
                    "trigger_only_on_success": false,
                    "trigger_mode": "once",
                    "show_api": false,
                    "zerogpu": false,
                    "rendered_in": null
                }, {
                    "id": 2,
                    "targets": [[11, "click"]],
                    "inputs": [],
                    "outputs": [1, 1],
                    "backend_fn": true,
                    "js": null,
                    "queue": true,
                    "api_name": "lambda",
                    "scroll_to_output": false,
                    "show_progress": "full",
                    "every": null,
                    "batch": false,
                    "max_batch_size": 4,
                    "cancels": [],
                    "types": {
                        "continuous": false,
                        "generator": false,
                        "cancel": false
                    },
                    "collects_event_data": false,
                    "trigger_after": null,
                    "trigger_only_on_success": false,
                    "trigger_mode": "once",
                    "show_api": false,
                    "zerogpu": false,
                    "rendered_in": null
                }, {
                    "id": 3,
                    "targets": [[11, "click"]],
                    "inputs": [],
                    "outputs": [8],
                    "backend_fn": false,
                    "js": "() =\u003e [{\"variant\": null, \"visible\": true, \"__type__\": \"update\"}]\n            ",
                    "queue": false,
                    "api_name": "js_fn_1",
                    "scroll_to_output": false,
                    "show_progress": "full",
                    "every": null,
                    "batch": false,
                    "max_batch_size": 4,
                    "cancels": [],
                    "types": {
                        "continuous": false,
                        "generator": false,
                        "cancel": false
                    },
                    "collects_event_data": false,
                    "trigger_after": null,
                    "trigger_only_on_success": false,
                    "trigger_mode": "once",
                    "show_api": false,
                    "zerogpu": false,
                    "rendered_in": null
                }, {
                    "id": 4,
                    "targets": [[15, "click"]],
                    "inputs": [15],
                    "outputs": [2],
                    "backend_fn": true,
                    "js": null,
                    "queue": false,
                    "api_name": "load_example",
                    "scroll_to_output": false,
                    "show_progress": "hidden",
                    "every": null,
                    "batch": false,
                    "max_batch_size": 4,
                    "cancels": [],
                    "types": {
                        "continuous": false,
                        "generator": false,
                        "cancel": false
                    },
                    "collects_event_data": false,
                    "trigger_after": null,
                    "trigger_only_on_success": false,
                    "trigger_mode": "once",
                    "show_api": false,
                    "zerogpu": false,
                    "rendered_in": null
                }],
                "root": "https://kingabzpro-ai-chatbot.hf.space"
            };
        </script>
        <link rel="preconnect" href="https://fonts.googleapis.com"/>
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous"/>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/4.3.1/iframeResizer.contentWindow.min.js" async></script>
        <script type="module" crossorigin src="./assets/index-COY1HN2y.js"></script>
        <link rel="stylesheet" crossorigin href="./assets/index-luc1OtuK.css">
    </head>
    <body style="
			width: 100%;
			margin: 0;
			padding: 0;
			display: flex;
			flex-direction: column;
			flex-grow: 1;
		">
        <gradio-app control_page_title="true" embed="false" eager="true" style="display: flex; flex-direction: column; flex-grow: 1"></gradio-app>
        <script>
            const ce = document.getElementsByTagName("gradio-app");

            if (ce[0]) {
                ce[0].addEventListener("domchange", ()=>{
                    document.body.style.padding = "0";
                }
                );
                document.body.style.padding = "0";
            }
        </script>
    </body>
</html>