mirror of
https://github.com/gradio-app/gradio.git
synced 2024-12-15 02:11:15 +08:00
changes
This commit is contained in:
Ali Abid
parent
5c0fc0148d
commit
6560f53647
@ -75,6 +75,7 @@ iface = gr.Interface(
|
||||
["the quick brown fox", "jumps over the lazy dog", 10, 12, 4, True, ["foo", "baz"], "baz", "bar", "files/cheetah1.jpg", "files/cheetah1.jpg", "files/cheetah1.jpg", "files/cheetah1.jpg", "files/world.mp4", "files/cantina.wav", "files/cantina.wav","files/titanic.csv", [[1,2,3],[3,4,5]], "files/time.csv"]
|
||||
] * 3,
|
||||
title="Kitchen Sink",
|
||||
theme="default",
|
||||
description="Try out all the components!",
|
||||
article="Learn more about [Gradio](http://gradio.app)"
|
||||
)
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" style="height: 100%; margin: 0; padding: 0;">
|
||||
<html lang="en" style="min-height: 100%; margin: 0; padding: 0;">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
|
||||
8
frontend-svelte/public/static/img/api-logo.svg
Normal file
8
frontend-svelte/public/static/img/api-logo.svg
Normal file
@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="189.38997mm" height="219.02647mm" viewBox="0 0 189.38997 219.02647" version="1.1" id="svg6" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<g transform="translate(-48.100733,-16.629147)" style="fill:#eb9f59;fill-opacity:1">
|
||||
<path style="fill:#eb9f59;fill-opacity:1;stroke-width:0.264583" d="m 99.013488,228.53136 c 0.26339,-0.29104 0.538422,-0.52916 0.611182,-0.52916 0.07276,0 -0.08321,0.23812 -0.346599,0.52916 -0.26339,0.29105 -0.538421,0.52917 -0.611182,0.52917 -0.07276,0 0.08321,-0.23812 0.346599,-0.52917 z m -41.552032,-2.44739 -1.045885,-1.12448 1.12448,1.04588 c 0.618463,0.57524 1.124479,1.08126 1.124479,1.12448 0,0.20018 -0.230413,-1.3e-4 -1.203074,-1.04588 z m 44.594744,-0.56292 c 0,-0.0549 0.20836,-0.2633 0.46302,-0.46302 0.41964,-0.32911 0.429,-0.31975 0.0999,0.0999 -0.34564,0.44073 -0.56291,0.58088 -0.56291,0.36312 z m -53.933229,-23.7126 c 0,-0.3638 0.06006,-0.51263 0.133454,-0.33073 0.0734,0.1819 0.0734,0.47956 0,0.66146 -0.0734,0.1819 -0.133454,0.0331 -0.133454,-0.33073 z M 113.18959,74.654109 c 0.0127,-0.308226 0.0754,-0.370919 0.15985,-0.159853 0.0764,0.190994 0.067,0.4192 -0.0209,0.507119 -0.0879,0.08792 -0.15045,-0.06835 -0.13896,-0.347266 z M 225.61661,46.927302 c 0,-0.05494 0.20836,-0.2633 0.46302,-0.463021 0.41965,-0.329107 0.42901,-0.319749 0.0999,0.0999 -0.34564,0.44073 -0.56292,0.580888 -0.56292,0.363125 z m -51.85833,-2.38125 c 0,-0.05494 0.20836,-0.2633 0.46302,-0.463021 0.41965,-0.329107 0.429,-0.319749 0.0999,0.0999 -0.34565,0.44073 -0.56292,0.580888 -0.56292,0.363125 z m 4.49792,-5.291666 c 0,-0.05494 0.20836,-0.263301 0.46302,-0.463021 0.41964,-0.329108 0.429,-0.319749 0.0999,0.0999 -0.34564,0.44073 -0.56291,0.580887 -0.56291,0.363125 z m -46.43438,-4.662604 c 0.71666,-0.727605 1.36256,-1.322917 1.43532,-1.322917 0.0728,0 -0.45407,0.595312 -1.17074,1.322917 -0.71666,0.727604 -1.36255,1.322916 -1.43531,1.322916 -0.0728,0 0.45407,-0.595312 1.17073,-1.322916 z m 36.3306,-17.64324 c 0.191,-0.07643 0.4192,-0.06703 0.50712,0.02088 0.0879,0.08792 -0.0683,0.150452 -0.34727,0.138964 -0.30822,-0.0127 -0.37092,-0.07539 -0.15985,-0.15985 z m 2.91042,-0.264583 c 0.19099,-0.07643 0.4192,-0.06703 0.50712,0.02088 0.0879,0.08792 -0.0684,0.150453 -0.34727,0.138965 -0.30823,-0.0127 -0.37092,-0.07539 -0.15985,-0.159851 z m 6.08541,0 c 0.191,-0.07643 0.4192,-0.06703 0.50712,0.02088 0.0879,0.08792 -0.0684,0.150453 -0.34726,0.138965 -0.30823,-0.0127 -0.37092,-0.07539 -0.15986,-0.159851 z" />
|
||||
<path style="fill:#eb9f59;fill-opacity:1;stroke-width:0.264583" d="m 76.606587,235.49438 c 0.190995,-0.0764 0.419201,-0.067 0.507119,0.0209 0.08792,0.0879 -0.06835,0.15047 -0.347266,0.13899 -0.308226,-0.0127 -0.370919,-0.0754 -0.159853,-0.15987 z m -28.47381,-28.79114 c 0.0054,-0.43656 0.06469,-0.58313 0.131773,-0.32569 0.06708,0.25743 0.06267,0.61461 -0.0098,0.79375 -0.07248,0.17913 -0.127363,-0.0315 -0.12197,-0.46806 z m -0.03069,-3.9908 c 0.0127,-0.30822 0.07539,-0.37092 0.159851,-0.15985 0.07643,0.19099 0.06703,0.4192 -0.02088,0.50712 -0.08792,0.0879 -0.150452,-0.0684 -0.138964,-0.34727 z M 172.12117,142.09646 c 0.191,-0.0764 0.4192,-0.067 0.50712,0.0209 0.0879,0.0879 -0.0683,0.15046 -0.34727,0.13897 -0.30822,-0.0127 -0.37092,-0.0754 -0.15985,-0.15985 z m 2.91042,-0.26458 c 0.19099,-0.0764 0.4192,-0.067 0.50712,0.0209 0.0879,0.0879 -0.0684,0.15045 -0.34727,0.13897 -0.30823,-0.0127 -0.37092,-0.0754 -0.15985,-0.15986 z m 39.73711,-15.79416 c 0,-0.0549 0.20836,-0.2633 0.46302,-0.46302 0.41964,-0.32911 0.429,-0.31975 0.0999,0.0999 -0.34564,0.44073 -0.56291,0.58089 -0.56291,0.36313 z M 188.64109,84.143941 c 0.40018,-0.06062 1.05503,-0.06062 1.45521,0 0.40018,0.06062 0.0728,0.110222 -0.7276,0.110222 -0.80037,0 -1.12779,-0.0496 -0.72761,-0.110222 z m 48.63808,-0.493999 c 0.0127,-0.308226 0.0754,-0.370919 0.15985,-0.159853 0.0764,0.190995 0.067,0.4192 -0.0209,0.507119 -0.0879,0.08792 -0.15045,-0.06835 -0.13896,-0.347266 z m -34.8136,-4.872744 c 0.56839,-0.582083 1.09297,-1.058333 1.16573,-1.058333 0.0728,0 -0.33276,0.47625 -0.90115,1.058333 -0.56838,0.582084 -1.09296,1.058334 -1.16572,1.058334 -0.0728,0 0.33275,-0.47625 0.90114,-1.058334 z m 34.84429,-3.836458 c 0.005,-0.436563 0.0647,-0.583126 0.13177,-0.325694 0.0671,0.257431 0.0627,0.614619 -0.01,0.79375 -0.0725,0.179131 -0.12737,-0.03149 -0.12197,-0.468056 z M 165.9076,61.44699 c 0.001,-1.018646 0.049,-1.402943 0.10627,-0.853996 0.0573,0.54895 0.0563,1.382387 -0.002,1.852084 -0.0585,0.469699 -0.10532,0.02056 -0.10414,-0.998088 z m 58.3861,-12.932188 c 0,-0.05494 0.20836,-0.2633 0.46302,-0.463021 0.41964,-0.329107 0.429,-0.319749 0.0999,0.0999 -0.34564,0.44073 -0.56291,0.580888 -0.56291,0.363125 z m -48.15417,-6.879166 c 0,-0.05494 0.20836,-0.263301 0.46302,-0.463021 0.41965,-0.329108 0.429,-0.319749 0.0999,0.0999 -0.34565,0.44073 -0.56292,0.580887 -0.56292,0.363125 z m 4.49792,-5.291667 c 0,-0.05494 0.20836,-0.2633 0.46302,-0.463021 0.41964,-0.329107 0.429,-0.319749 0.0999,0.0999 -0.34564,0.44073 -0.56291,0.580888 -0.56291,0.363125 z m -46.30209,-3.96875 c 0,-0.05494 0.20836,-0.2633 0.46302,-0.463021 0.41965,-0.329107 0.42901,-0.319749 0.0999,0.0999 -0.34564,0.44073 -0.56292,0.580888 -0.56292,0.363125 z m 45.45873,-15.426677 c 0.19099,-0.07643 0.4192,-0.06703 0.50712,0.02088 0.0879,0.08792 -0.0684,0.150452 -0.34727,0.138964 -0.30823,-0.0127 -0.37092,-0.07539 -0.15985,-0.15985 z m -7.29258,-0.276585 c 0.5457,-0.05708 1.43867,-0.05708 1.98437,0 0.54571,0.05708 0.0992,0.103786 -0.99218,0.103786 -1.09141,0 -1.53789,-0.0467 -0.99219,-0.103786 z m 3.85299,0.01201 c 0.191,-0.07643 0.4192,-0.06703 0.50712,0.02088 0.0879,0.08792 -0.0683,0.150453 -0.34726,0.138964 -0.30823,-0.0127 -0.37092,-0.07539 -0.15986,-0.15985 z" />
|
||||
<path style="fill:#eb9f59;fill-opacity:1;stroke-width:0.264583" d="m 75.212304,235.2476 c -4.768424,-0.86074 -9.89013,-3.14915 -14.156303,-6.32518 -9.921891,-7.38651 -14.817371,-19.77821 -12.085188,-30.5907 1.113261,-4.40567 2.03654,-6.45122 4.739941,-10.50147 0.712058,-1.06681 15.399907,-20.21223 32.639659,-42.54536 l 31.345007,-40.60571 -1.19176,-3.88901 c -1.77435,-5.790137 -2.19948,-7.791017 -3.06496,-14.425346 -0.83847,-6.427195 0.12466,-16.786696 2.23901,-24.082846 1.61271,-5.565148 5.04296,-12.996921 8.10684,-17.563838 9.1454,-13.631799 22.76859,-23.101774 38.33206,-26.646 7.1018,-1.617273 17.42134,-1.617477 24.53969,-5.29e-4 2.79586,0.635148 6.68115,1.784175 6.68115,1.975914 0,0.681228 -8.51197,11.500323 -15.606,19.835923 -8.93791,10.502194 -9.94047,11.958402 -11.0907,16.109143 -2.03047,7.327204 0.13873,14.823086 6.0037,20.746331 4.98075,5.030238 10.43175,7.42704 16.85654,7.41181 3.38749,-0.008 5.42319,-0.468852 8.16035,-1.847262 3.93316,-1.980711 6.66847,-4.747496 10.15627,-10.273147 6.09648,-9.658522 16.39286,-23.861334 18.66603,-25.747895 0.83884,-0.69618 6.11005,9.216877 8.0958,15.225014 5.59821,16.938083 3.0088,35.139117 -7.18486,50.502628 -10.315,15.54639 -27.259,26.03055 -47.2239,29.21996 -3.03525,0.48488 -9.10183,1.03651 -11.45889,1.04194 l -2.26837,0.005 -31.51693,40.81198 c -17.33431,22.44659 -32.05376,41.4589 -32.70988,42.24959 -3.066208,3.69504 -8.092656,7.18047 -12.802697,8.87762 -3.905258,1.40716 -9.76262,1.83248 -14.201609,1.03121 z" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.1 KiB |
67
frontend-svelte/public/static/img/clear.svg
Normal file
67
frontend-svelte/public/static/img/clear.svg
Normal file
@ -0,0 +1,67 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
width="5.9403949mm"
|
||||
height="5.9403949mm"
|
||||
viewBox="0 0 5.9403949 5.9403949"
|
||||
version="1.1"
|
||||
id="svg5"
|
||||
inkscape:version="1.1 (c68e22c387, 2021-05-23)"
|
||||
sodipodi:docname="clear.svg"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<sodipodi:namedview
|
||||
id="namedview7"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:document-units="mm"
|
||||
showgrid="false"
|
||||
inkscape:zoom="10.925474"
|
||||
inkscape:cx="4.1188143"
|
||||
inkscape:cy="15.559965"
|
||||
inkscape:window-width="1248"
|
||||
inkscape:window-height="770"
|
||||
inkscape:window-x="-6"
|
||||
inkscape:window-y="-6"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="layer1" />
|
||||
<defs
|
||||
id="defs2" />
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-115.10942,-119.22353)">
|
||||
<g
|
||||
id="g239"
|
||||
transform="matrix(0.05138986,0.05138986,-0.05138986,0.05138986,117.0869,112.75317)">
|
||||
<rect
|
||||
style="fill:#000000;stroke-width:0.295287"
|
||||
id="rect31"
|
||||
width="20"
|
||||
height="80"
|
||||
x="-111.51107"
|
||||
y="42.193726"
|
||||
rx="2.9434128"
|
||||
ry="2.6448057"
|
||||
transform="scale(-1,1)" />
|
||||
<rect
|
||||
style="fill:#000000;stroke-width:0.295287"
|
||||
id="rect31-3"
|
||||
width="20"
|
||||
height="80"
|
||||
x="-92.193726"
|
||||
y="-141.51106"
|
||||
rx="2.9434128"
|
||||
ry="2.6448057"
|
||||
transform="matrix(0,-1,-1,0,0,0)" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
39
frontend-svelte/public/static/img/edit.svg
Normal file
39
frontend-svelte/public/static/img/edit.svg
Normal file
@ -0,0 +1,39 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
fill="#000000"
|
||||
viewBox="0 0 24 24"
|
||||
width="24px"
|
||||
height="24px"
|
||||
version="1.1"
|
||||
id="svg4"
|
||||
sodipodi:docname="edit.svg"
|
||||
inkscape:version="1.1 (c68e22c387, 2021-05-23)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs8" />
|
||||
<sodipodi:namedview
|
||||
id="namedview6"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
showgrid="false"
|
||||
inkscape:zoom="11.291667"
|
||||
inkscape:cx="10.538745"
|
||||
inkscape:cy="16.383764"
|
||||
inkscape:window-width="1248"
|
||||
inkscape:window-height="770"
|
||||
inkscape:window-x="-6"
|
||||
inkscape:window-y="-6"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg4" />
|
||||
<path
|
||||
d="m 19.701578,1.2915129 c -0.814834,0 -1.629669,0.307743 -2.251701,0.9246243 l -1.319356,1.3084307 4.503402,4.46611 1.319356,-1.3084308 c 1.242939,-1.2326462 1.242939,-3.232347 0,-4.4661099 C 21.331247,1.5992559 20.516413,1.2915129 19.701578,1.2915129 Z M 14.441745,5.1993591 1.494465,18.039425 v 4.46611 H 5.997867 L 18.945148,9.665469 Z"
|
||||
id="path2"
|
||||
style="stroke-width:1.12118" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
119
frontend-svelte/public/static/img/logo.svg
Normal file
119
frontend-svelte/public/static/img/logo.svg
Normal file
@ -0,0 +1,119 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
width="26.399866mm"
|
||||
height="26.001007mm"
|
||||
viewBox="0 0 26.399867 26.001007"
|
||||
version="1.1"
|
||||
id="svg5"
|
||||
inkscape:version="1.1 (c68e22c387, 2021-05-23)"
|
||||
sodipodi:docname="logo.svg"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<sodipodi:namedview
|
||||
id="namedview7"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:document-units="mm"
|
||||
showgrid="false"
|
||||
inkscape:zoom="2.7313686"
|
||||
inkscape:cx="-5.8578692"
|
||||
inkscape:cy="65.534912"
|
||||
inkscape:window-width="1248"
|
||||
inkscape:window-height="770"
|
||||
inkscape:window-x="-6"
|
||||
inkscape:window-y="-6"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="layer1" />
|
||||
<defs
|
||||
id="defs2" />
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-113.51105,-128.48206)">
|
||||
<path
|
||||
style="fill:#000000;stroke-width:1.02388"
|
||||
id="path21"
|
||||
d="" />
|
||||
<path
|
||||
style="fill:#000000;stroke-width:0.271737"
|
||||
id="path3317"
|
||||
d="" />
|
||||
<g
|
||||
id="g880"
|
||||
transform="matrix(0.56975915,0,0,0.56975915,63.360109,62.438369)">
|
||||
<rect
|
||||
style="fill:#f1bc8a;fill-opacity:1;stroke-width:0.0943025"
|
||||
id="rect5331-6-3-1-7"
|
||||
width="20.721741"
|
||||
height="5.805635"
|
||||
x="-147.61293"
|
||||
y="69.866898"
|
||||
transform="matrix(-0.87679283,-0.48086831,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#f1bc8a;fill-opacity:1;stroke-width:0.0943025"
|
||||
id="rect5331-6-3-1"
|
||||
width="20.721741"
|
||||
height="5.805635"
|
||||
x="-147.61293"
|
||||
y="59.790516"
|
||||
transform="matrix(-0.87679283,-0.48086831,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#eba059;fill-opacity:1;stroke-width:0.0942989"
|
||||
id="rect5331-6-4"
|
||||
width="20.79833"
|
||||
height="5.8430037"
|
||||
x="126.81767"
|
||||
y="201.76166"
|
||||
transform="matrix(0.87677457,-0.48090161,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#f1bc8a;fill-opacity:1;stroke-width:0.0943025"
|
||||
id="rect5331-6-3-1-3"
|
||||
width="20.799767"
|
||||
height="5.8430223"
|
||||
x="-126.81503"
|
||||
y="79.79348"
|
||||
transform="matrix(-0.87679283,-0.48086831,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#eba059;fill-opacity:1;stroke-width:0.0944389"
|
||||
id="rect5331-6-3"
|
||||
width="20.859709"
|
||||
height="5.8430514"
|
||||
x="105.92157"
|
||||
y="181.56015"
|
||||
transform="matrix(0.87755288,-0.47947986,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#eba059;fill-opacity:1;stroke-width:0.0942989"
|
||||
id="rect5331-6-4-9"
|
||||
width="20.79833"
|
||||
height="5.8430037"
|
||||
x="126.81767"
|
||||
y="211.83795"
|
||||
transform="matrix(0.87677457,-0.48090161,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#f1bc8a;fill-opacity:1;stroke-width:0.0943025"
|
||||
id="rect5331-6-3-1-3-1"
|
||||
width="20.799767"
|
||||
height="5.8430223"
|
||||
x="-126.81503"
|
||||
y="89.869843"
|
||||
transform="matrix(-0.87679283,-0.48086831,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#eba059;fill-opacity:1;stroke-width:0.0944389"
|
||||
id="rect5331-6-3-2"
|
||||
width="20.859709"
|
||||
height="5.8430514"
|
||||
x="105.92157"
|
||||
y="191.63644"
|
||||
transform="matrix(0.87755288,-0.47947986,0,1,0,0)" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.7 KiB |
134
frontend-svelte/public/static/img/logo_error.svg
Normal file
134
frontend-svelte/public/static/img/logo_error.svg
Normal file
@ -0,0 +1,134 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
width="40.810085mm"
|
||||
height="10.393202mm"
|
||||
viewBox="0 0 40.810087 10.393202"
|
||||
version="1.1"
|
||||
id="svg5"
|
||||
inkscape:version="1.1 (c68e22c387, 2021-05-23)"
|
||||
sodipodi:docname="logo_error.svg"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<sodipodi:namedview
|
||||
id="namedview7"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:document-units="mm"
|
||||
showgrid="false"
|
||||
inkscape:zoom="2.7313686"
|
||||
inkscape:cx="97.020959"
|
||||
inkscape:cy="33.133573"
|
||||
inkscape:window-width="1278"
|
||||
inkscape:window-height="991"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="g880" />
|
||||
<defs
|
||||
id="defs2" />
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-90.438365,-136.96404)">
|
||||
<path
|
||||
style="fill:#000000;stroke-width:1.02388"
|
||||
id="path21"
|
||||
d="" />
|
||||
<path
|
||||
style="fill:#000000;stroke-width:0.271737"
|
||||
id="path3317"
|
||||
d="" />
|
||||
<g
|
||||
id="g880"
|
||||
transform="matrix(0.56975915,0,0,0.56975915,63.360109,62.438369)">
|
||||
<g
|
||||
id="g842"
|
||||
transform="matrix(0.79495203,0,0,0.79495203,13.79033,28.860894)">
|
||||
<rect
|
||||
style="fill:#f08a8d;fill-opacity:1;stroke-width:0.0478859"
|
||||
id="rect5331-6-3-1-7"
|
||||
width="10.522298"
|
||||
height="2.9480448"
|
||||
x="-146.48871"
|
||||
y="70.555779"
|
||||
transform="matrix(-0.87679283,-0.48086831,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#f08a8d;fill-opacity:1;stroke-width:0.0478859"
|
||||
id="rect5331-6-3-1"
|
||||
width="10.522298"
|
||||
height="2.9480448"
|
||||
x="-146.48871"
|
||||
y="65.439095"
|
||||
transform="matrix(-0.87679283,-0.48086831,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#ec7c80;fill-opacity:1;stroke-width:0.0478841"
|
||||
id="rect5331-6-4"
|
||||
width="10.56119"
|
||||
height="2.9670203"
|
||||
x="135.93057"
|
||||
y="206.32899"
|
||||
transform="matrix(0.87677457,-0.48090161,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#f08a8d;fill-opacity:1;stroke-width:0.0478859"
|
||||
id="rect5331-6-3-1-3"
|
||||
width="10.561918"
|
||||
height="2.9670298"
|
||||
x="-135.92775"
|
||||
y="75.596405"
|
||||
transform="matrix(-0.87679283,-0.48086831,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#ec7c80;fill-opacity:1;stroke-width:0.0479552"
|
||||
id="rect5331-6-3"
|
||||
width="10.592357"
|
||||
height="2.9670446"
|
||||
x="125.25629"
|
||||
y="195.93875"
|
||||
transform="matrix(0.87755288,-0.47947986,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#ec7c80;fill-opacity:1;stroke-width:0.0478841"
|
||||
id="rect5331-6-4-9"
|
||||
width="10.56119"
|
||||
height="2.9670203"
|
||||
x="135.93057"
|
||||
y="211.44563"
|
||||
transform="matrix(0.87677457,-0.48090161,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#f08a8d;fill-opacity:1;stroke-width:0.0478859"
|
||||
id="rect5331-6-3-1-3-1"
|
||||
width="10.561918"
|
||||
height="2.9670298"
|
||||
x="-135.92775"
|
||||
y="80.713081"
|
||||
transform="matrix(-0.87679283,-0.48086831,0,1,0,0)" />
|
||||
<rect
|
||||
style="fill:#ec7c80;fill-opacity:1;stroke-width:0.0479552"
|
||||
id="rect5331-6-3-2"
|
||||
width="10.592357"
|
||||
height="2.9670446"
|
||||
x="125.25629"
|
||||
y="201.05539"
|
||||
transform="matrix(0.87755288,-0.47947986,0,1,0,0)" />
|
||||
</g>
|
||||
<text
|
||||
xml:space="preserve"
|
||||
style="font-size:12.9405px;line-height:1.25;font-family:Arial;-inkscape-font-specification:Arial;fill:#ec7c80;fill-opacity:1;stroke-width:0.323512"
|
||||
x="50.629585"
|
||||
y="144.87993"
|
||||
id="text6662"><tspan
|
||||
sodipodi:role="line"
|
||||
id="tspan6660"
|
||||
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:Arial;-inkscape-font-specification:'Arial Bold';fill:#ec7c80;fill-opacity:1;stroke-width:0.323512"
|
||||
x="50.629585"
|
||||
y="144.87993">ERROR</tspan></text>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.5 KiB |
@ -4,6 +4,7 @@
|
||||
export let title;
|
||||
export let description;
|
||||
export let theme;
|
||||
export let dark;
|
||||
export let input_components;
|
||||
export let output_components;
|
||||
export let fn;
|
||||
@ -14,6 +15,7 @@
|
||||
? 'h-full'
|
||||
: 'h-auto'}"
|
||||
{theme}
|
||||
class:dark
|
||||
>
|
||||
<div
|
||||
class="gradio-page container mx-auto flex flex-col box-border flex-grow text-gray-700 dark:text-gray-50"
|
||||
|
||||
@ -3,16 +3,20 @@
|
||||
inputComponentMap,
|
||||
outputComponentMap,
|
||||
} from "./components/directory.js";
|
||||
import { deepCopy } from "./components/utils/helpers.js";
|
||||
|
||||
export let input_components;
|
||||
export let output_components;
|
||||
export let theme;
|
||||
export let fn;
|
||||
|
||||
let input_values = input_components.map((component) =>
|
||||
const default_inputs = input_components.map((component) =>
|
||||
"default" in component ? component.default : null
|
||||
);
|
||||
let output_values = new Array(output_components.length).fill(null);
|
||||
const default_outputs = new Array(output_components.length).fill(null);
|
||||
|
||||
let input_values = deepCopy(default_inputs);
|
||||
let output_values = deepCopy(default_outputs);
|
||||
|
||||
const setValues = (index, value) => {
|
||||
input_values[index] = value;
|
||||
@ -22,7 +26,10 @@
|
||||
output_values = output["data"];
|
||||
});
|
||||
};
|
||||
const clear = () => {};
|
||||
const clear = () => {
|
||||
input_values = deepCopy(default_inputs);
|
||||
output_values = deepCopy(default_outputs);
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class="gradio-interface" {theme}>
|
||||
@ -70,11 +77,11 @@
|
||||
<div class="component" key={i}>
|
||||
<div class="panel-header mb-1.5">{output_component.label}</div>
|
||||
<svelte:component
|
||||
this={outputComponentMap[output_component.name]}
|
||||
{...output_component}
|
||||
{theme}
|
||||
value={output_values[i]}
|
||||
/>
|
||||
this={outputComponentMap[output_component.name]}
|
||||
{...output_component}
|
||||
{theme}
|
||||
value={output_values[i]}
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
{/each}
|
||||
@ -109,5 +116,29 @@
|
||||
.panel-button.submit {
|
||||
@apply bg-yellow-500 hover:bg-yellow-400 dark:bg-red-700 dark:hover:bg-red-600 text-white;
|
||||
}
|
||||
.examples {
|
||||
.examples-table-holder:not(.gallery) {
|
||||
@apply shadow;
|
||||
.examples-table {
|
||||
@apply rounded dark:bg-gray-700;
|
||||
thead {
|
||||
@apply border-gray-300 dark:border-gray-600;
|
||||
}
|
||||
tbody tr:hover {
|
||||
@apply bg-yellow-500 dark:bg-red-700 text-white;
|
||||
}
|
||||
}
|
||||
}
|
||||
.examples-table-holder.gallery .examples-table {
|
||||
tbody td {
|
||||
@apply shadow;
|
||||
}
|
||||
tbody td:hover {
|
||||
@apply bg-yellow-500 text-white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.gradio-interface[theme="huggingface"] {
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<script>
|
||||
import Upload from "../utils/Upload.svelte";
|
||||
import ModifyUpload from "../utils/ModifyUpload.svelte";
|
||||
|
||||
export let value, setValue, theme;
|
||||
export let source;
|
||||
@ -25,7 +26,8 @@
|
||||
</Upload>
|
||||
{/if}
|
||||
{:else}
|
||||
<audio controls>
|
||||
<ModifyUpload clear={() => setValue(null)} absolute={false} {theme} />
|
||||
<audio class="w-full" controls>
|
||||
<source src={value.data} />
|
||||
</audio>
|
||||
{/if}
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<script>
|
||||
import Upload from "../utils/Upload.svelte";
|
||||
import ModifyUpload from "../utils/ModifyUpload.svelte";
|
||||
import { prettyBytes } from "../utils/helpers";
|
||||
|
||||
export let value, setValue, theme;
|
||||
@ -14,6 +15,7 @@
|
||||
</Upload>
|
||||
{:else}
|
||||
<div class="file-preview w-full flex flex-col justify-center items-center relative">
|
||||
<ModifyUpload clear={() => setValue(null)} {theme} />
|
||||
<div class="file-name text-4xl p-6 break-all">{value.name}</div>
|
||||
<div class="file-size text-2xl p-2">
|
||||
{prettyBytes(value.size)}
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<script>
|
||||
import Upload from "../utils/Upload.svelte";
|
||||
import ModifyUpload from "../utils/ModifyUpload.svelte";
|
||||
|
||||
export let value, setValue, theme;
|
||||
export let source;
|
||||
@ -20,7 +21,15 @@
|
||||
</Upload>
|
||||
{/if}
|
||||
{:else}
|
||||
<div class="image-preview w-full h-60 flex justify-center items-center bg-gray-200 dark:bg-gray-600 relative">
|
||||
<div
|
||||
class="image-preview w-full h-60 flex justify-center items-center bg-gray-200 dark:bg-gray-600 relative"
|
||||
>
|
||||
<ModifyUpload
|
||||
edit={() => setValue(null)}
|
||||
clear={() => setValue(null)}
|
||||
{theme}
|
||||
/>
|
||||
<!-- svelte-ignore a11y-missing-attribute -->
|
||||
<img class="w-full h-full object-contain" src={value} />
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
<input
|
||||
type="range"
|
||||
class="range w-full appearance-none transition rounded h-4"
|
||||
on:input={(e) => setValue(e.target.value)}
|
||||
on:input={(e) => setValue(parseFloat(e.target.value))}
|
||||
{value}
|
||||
min={minimum}
|
||||
max={maximum}
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
<script>
|
||||
import Upload from "../utils/Upload.svelte";
|
||||
import ModifyUpload from "../utils/ModifyUpload.svelte";
|
||||
import { prettyBytes, playable } from "../utils/helpers";
|
||||
|
||||
export let value, setValue, theme;
|
||||
export let source;
|
||||
|
||||
</script>
|
||||
|
||||
<div class="input-video">
|
||||
@ -20,7 +20,9 @@
|
||||
<div
|
||||
class="video-preview w-full h-60 object-contain flex justify-center items-center bg-gray-200 dark:bg-gray-600 relative"
|
||||
>
|
||||
<ModifyUpload clear={() => setValue(null)} {theme} />
|
||||
{#if playable(value.name)}
|
||||
<!-- svelte-ignore a11y-media-has-caption -->
|
||||
<video
|
||||
class="video_preview"
|
||||
controls
|
||||
@ -29,13 +31,14 @@
|
||||
src={value.data}
|
||||
/>
|
||||
{:else}
|
||||
<div class="file-preview h-60 w-full flex flex-col justify-center items-center relative">
|
||||
<div class="file-name text-4xl p-6 break-all">{value.name}</div>
|
||||
<div class="file-size text-2xl p-2">
|
||||
{prettyBytes(value.size)}
|
||||
<div
|
||||
class="file-preview h-60 w-full flex flex-col justify-center items-center relative"
|
||||
>
|
||||
<div class="file-name text-4xl p-6 break-all">{value.name}</div>
|
||||
<div class="file-size text-2xl p-2">
|
||||
{prettyBytes(value.size)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
41
frontend-svelte/src/components/utils/ModifyUpload.svelte
Normal file
41
frontend-svelte/src/components/utils/ModifyUpload.svelte
Normal file
@ -0,0 +1,41 @@
|
||||
<script>
|
||||
export let edit, clear, theme;
|
||||
export let absolute = true;
|
||||
</script>
|
||||
|
||||
<div class="modify-upload z-10 top-0 right-0 flex justify-end" class:absolute {theme}>
|
||||
{#if edit}
|
||||
<button
|
||||
class="edit bg-opacity-30 hover:bg-opacity-100 transition p-1"
|
||||
on:click={edit}
|
||||
>
|
||||
<img
|
||||
class="h-4 filter dark:invert"
|
||||
src="static/img/edit.svg"
|
||||
alt="Edit"
|
||||
/>
|
||||
</button>
|
||||
{/if}
|
||||
<button
|
||||
class="clear bg-opacity-30 hover:bg-opacity-100 transition p-1"
|
||||
on:click={clear}
|
||||
>
|
||||
<img
|
||||
class="h-4 filter dark:invert"
|
||||
src="static/img/clear.svg"
|
||||
alt="Clear"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<style lang="postcss">
|
||||
.modify-upload[theme="default"] {
|
||||
@apply m-1 flex gap-1;
|
||||
.edit {
|
||||
@apply bg-yellow-500 dark:bg-red-600 rounded shadow;
|
||||
}
|
||||
.clear {
|
||||
@apply bg-gray-50 dark:bg-gray-500 rounded shadow;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,71 +1,71 @@
|
||||
<script>
|
||||
export let load, filetype, theme;
|
||||
export let single_file = true;
|
||||
export let include_file_metadata = true;
|
||||
let hidden_upload;
|
||||
export let load, filetype, theme;
|
||||
export let single_file = true;
|
||||
export let include_file_metadata = true;
|
||||
let hidden_upload;
|
||||
|
||||
const openFileUpload = () => {
|
||||
hidden_upload.click();
|
||||
};
|
||||
const loadFiles = (files) => {
|
||||
if (!files.length || !window.FileReader) {
|
||||
return;
|
||||
const openFileUpload = () => {
|
||||
hidden_upload.click();
|
||||
};
|
||||
const loadFiles = (files) => {
|
||||
if (!files.length || !window.FileReader) {
|
||||
return;
|
||||
}
|
||||
if (single_file) {
|
||||
files = [files[0]];
|
||||
}
|
||||
var all_file_data = [];
|
||||
files.forEach((file, i) => {
|
||||
let ReaderObj = new FileReader();
|
||||
ReaderObj.readAsDataURL(file);
|
||||
ReaderObj.onloadend = function (e) {
|
||||
all_file_data[i] = include_file_metadata
|
||||
? {
|
||||
name: file.name,
|
||||
size: file.size,
|
||||
data: this.result,
|
||||
is_example: false,
|
||||
}
|
||||
: this.result;
|
||||
if (Object.keys(all_file_data).length === files.length) {
|
||||
load(single_file ? all_file_data[0] : all_file_data);
|
||||
}
|
||||
if (single_file) {
|
||||
files = [files[0]];
|
||||
}
|
||||
var all_file_data = [];
|
||||
files.forEach((file, i) => {
|
||||
let ReaderObj = new FileReader();
|
||||
ReaderObj.readAsDataURL(file);
|
||||
ReaderObj.onloadend = function (e) {
|
||||
all_file_data[i] = include_file_metadata
|
||||
? {
|
||||
name: file.name,
|
||||
size: file.size,
|
||||
data: this.result,
|
||||
is_example: false,
|
||||
}
|
||||
: this.result;
|
||||
if (Object.keys(all_file_data).length === files.length) {
|
||||
load(single_file ? all_file_data[0] : all_file_data);
|
||||
}
|
||||
};
|
||||
});
|
||||
};
|
||||
const loadFilesFromUpload = (e) => {
|
||||
loadFiles(e.target.files);
|
||||
};
|
||||
const loadFilesFromDrop = (e) => {
|
||||
loadFiles(e.dataTransfer.files);
|
||||
};
|
||||
};
|
||||
});
|
||||
};
|
||||
const loadFilesFromUpload = (e) => {
|
||||
loadFiles(e.target.files);
|
||||
};
|
||||
const loadFilesFromDrop = (e) => {
|
||||
loadFiles(e.dataTransfer.files);
|
||||
};
|
||||
</script>
|
||||
|
||||
<div
|
||||
class="upload h-60 border-gray-300 text-gray-400 dark:text-gray-500 dark:border-gray-500 border-8 border-dashed w-full flex justify-center items-center text-3xl text-center cursor-pointer leading-10"
|
||||
{theme}
|
||||
on:drag|preventDefault|stopPropagation
|
||||
on:dragstart|preventDefault|stopPropagation
|
||||
on:dragend|preventDefault|stopPropagation
|
||||
on:dragover|preventDefault|stopPropagation
|
||||
on:dragenter|preventDefault|stopPropagation
|
||||
on:dragleave|preventDefault|stopPropagation
|
||||
on:drop|preventDefault|stopPropagation
|
||||
on:click={openFileUpload}
|
||||
on:drop={loadFilesFromDrop}
|
||||
class="upload h-60 border-gray-300 text-gray-400 dark:text-gray-500 dark:border-gray-500 border-8 border-dashed w-full flex justify-center items-center text-3xl text-center cursor-pointer leading-10"
|
||||
{theme}
|
||||
on:drag|preventDefault|stopPropagation
|
||||
on:dragstart|preventDefault|stopPropagation
|
||||
on:dragend|preventDefault|stopPropagation
|
||||
on:dragover|preventDefault|stopPropagation
|
||||
on:dragenter|preventDefault|stopPropagation
|
||||
on:dragleave|preventDefault|stopPropagation
|
||||
on:drop|preventDefault|stopPropagation
|
||||
on:click={openFileUpload}
|
||||
on:drop={loadFilesFromDrop}
|
||||
>
|
||||
<slot />
|
||||
<input
|
||||
class="hidden-upload hidden"
|
||||
type="file"
|
||||
bind:this={hidden_upload}
|
||||
on:change={loadFilesFromUpload}
|
||||
accept={filetype}
|
||||
/>
|
||||
<slot />
|
||||
<input
|
||||
class="hidden-upload hidden"
|
||||
type="file"
|
||||
bind:this={hidden_upload}
|
||||
on:change={loadFilesFromUpload}
|
||||
accept={filetype}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<style lang="postcss">
|
||||
.upload[theme="default"] {
|
||||
@apply transition hover:border-gray-400 hover:text-gray-500 dark:hover:border-gray-300 dark:hover:text-gray-300;
|
||||
}
|
||||
.upload[theme="default"] {
|
||||
@apply transition hover:border-gray-400 hover:text-gray-500 dark:hover:border-gray-300 dark:hover:text-gray-300;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -7,6 +7,10 @@ export const playable = (filename) => {
|
||||
return true; // FIX BEFORE COMMIT - mime import causing issues
|
||||
};
|
||||
|
||||
export const deepCopy = (obj) => {
|
||||
return JSON.parse(JSON.stringify(obj));
|
||||
}
|
||||
|
||||
export function randInt(min, max) {
|
||||
return Math.floor(Math.random() * (max - min) + min);
|
||||
}
|
||||
|
||||
@ -3,7 +3,17 @@ import { fn } from "./api";
|
||||
|
||||
window.launchGradio = (config, element_query) => {
|
||||
let target = document.querySelector(element_query);
|
||||
if (config.dark_mode) {
|
||||
let url = new URL(window.location.toString());
|
||||
if (config.theme !== null && config.theme.startsWith("dark")) {
|
||||
target.classList.add("dark");
|
||||
config.dark = true;
|
||||
if (config.theme === "dark") {
|
||||
config.theme = "default";
|
||||
} else {
|
||||
config.theme = config.theme.substring(5);
|
||||
}
|
||||
} else if (url.searchParams.get("__dark-theme") === "true") {
|
||||
config.dark = true;
|
||||
target.classList.add("dark");
|
||||
}
|
||||
config.fn = fn.bind(null, "BACKEND_URL" + "api/");
|
||||
|
||||
Loading…
Reference in New Issue
Block a user