import{S as io,i as po,s as uo,e as r,k as u,w as C,t as s,M as co,c as i,d as t,m as c,a as p,x as L,h as l,b as f,N as ba,F as a,g as n,y as H,L as fo,q as O,o as D,B as S,v as mo}from"../../chunks/vendor-1e8b365d.js";import{I as ro}from"../../chunks/IconCopyLink-483c28ba.js";import{C as ue}from"../../chunks/CodeBlock-e5764662.js";function ho(va){let x,Te,k,$,ce,M,dt,fe,ht,Ce,z,wt,Le,B,me,yt,He,K,gt,Oe,Q,bt,De,A,Se,V,vt,Me,b,g,xt,de,kt,_t,he,Et,$t,we,jt,It,Pt,m,Gt,ye,qt,Tt,ge,Ct,Lt,be,Ht,Ot,ve,Dt,St,xe,Mt,At,Ft,_,Nt,ke,Wt,Yt,_e,Jt,Rt,Ae,j,Ut,Ee,F,zt,Bt,Fe,d,xa,Ne,X,Kt,We,I,Qt,$e,Vt,Xt,Ye,Z,Zt,Je,N,Re,h,ka,Ue,ee,ea,ze,te,ta,Be,E,P,je,W,aa,Ie,oa,Ke,G,sa,Pe,la,na,Qe,v,ra,Ge,ia,pa,ae,ua,ca,Ve,oe,fa,Xe,Y,Ze,se,ma,et,J,tt,R,at,q,da,qe,ha,wa,ot,U,st,le,ya,lt,w,_a,nt,ne,ga,rt;return M=new ro({}),A=new ue({props:{code:`import gradio as gr


def greet(name):
    return "Hello " + name


demo = gr.Interface(fn=greet, inputs="text", outputs="text")

demo.launch()`,highlighted:`<span class="hljs-keyword">import</span> gradio <span class="hljs-keyword">as</span> gr


<span class="hljs-keyword">def</span> <span class="hljs-title function_">greet</span>(<span class="hljs-params">name</span>):
    <span class="hljs-keyword">return</span> <span class="hljs-string">&quot;Hello &quot;</span> + name


demo = gr.Interface(fn=greet, inputs=<span class="hljs-string">&quot;text&quot;</span>, outputs=<span class="hljs-string">&quot;text&quot;</span>)

demo.launch()`}}),N=new ue({props:{code:`import gradio as gr


def greet(name):
    return "Hello " + name


# We instantiate the Textbox class
textbox = gr.Textbox(label="Type your name here:", placeholder="John Doe", lines=2)

gr.Interface(fn=greet, inputs=textbox, outputs="text").launch()`,highlighted:`<span class="hljs-keyword">import</span> gradio <span class="hljs-keyword">as</span> gr


<span class="hljs-keyword">def</span> <span class="hljs-title function_">greet</span>(<span class="hljs-params">name</span>):
    <span class="hljs-keyword">return</span> <span class="hljs-string">&quot;Hello &quot;</span> + name


<span class="hljs-comment"># We instantiate the Textbox class</span>
textbox = gr.Textbox(label=<span class="hljs-string">&quot;Type your name here:&quot;</span>, placeholder=<span class="hljs-string">&quot;John Doe&quot;</span>, lines=<span class="hljs-number">2</span>)

gr.Interface(fn=greet, inputs=textbox, outputs=<span class="hljs-string">&quot;text&quot;</span>).launch()`}}),W=new ro({}),Y=new ue({props:{code:`from transformers import pipeline

model = pipeline("text-generation")


def predict(prompt):
    completion = model(prompt)[0]["generated_text"]
    return completion`,highlighted:`<span class="hljs-keyword">from</span> transformers <span class="hljs-keyword">import</span> pipeline

model = pipeline(<span class="hljs-string">&quot;text-generation&quot;</span>)


<span class="hljs-keyword">def</span> <span class="hljs-title function_">predict</span>(<span class="hljs-params">prompt</span>):
    completion = model(prompt)[<span class="hljs-number">0</span>][<span class="hljs-string">&quot;generated_text&quot;</span>]
    <span class="hljs-keyword">return</span> completion`}}),J=new ue({props:{code:'predict("My favorite programming language is")',highlighted:'<span class="hljs-function"><span class="hljs-title">predict</span><span class="hljs-params">(<span class="hljs-string">&quot;My favorite programming language is&quot;</span>)</span></span>'}}),R=new ue({props:{code:">> My favorite programming language is Haskell. I really enjoyed the Haskell language, but it doesn't have all the features that can be applied to any other language. For example, all it does is compile to a byte array.",highlighted:'&gt;&gt; My favorite programming language <span class="hljs-keyword">is</span> Haskell. I really enjoyed <span class="hljs-keyword">the</span> Haskell language, <span class="hljs-keyword">but</span> <span class="hljs-keyword">it</span> doesn&#x27;t have all <span class="hljs-keyword">the</span> features <span class="hljs-keyword">that</span> can be applied <span class="hljs-keyword">to</span> any other language. For example, all <span class="hljs-keyword">it</span> <span class="hljs-keyword">does</span> <span class="hljs-keyword">is</span> compile <span class="hljs-keyword">to</span> a byte array.'}}),U=new ue({props:{code:`import gradio as gr

gr.Interface(fn=predict, inputs="text", outputs="text").launch()`,highlighted:`<span class="hljs-keyword">import</span> gradio <span class="hljs-keyword">as</span> gr

gr.Interface(fn=predict, inputs=<span class="hljs-string">&quot;text&quot;</span>, outputs=<span class="hljs-string">&quot;text&quot;</span>).launch()`}}),{c(){x=r("meta"),Te=u(),k=r("h1"),$=r("a"),ce=r("span"),C(M.$$.fragment),dt=u(),fe=r("span"),ht=s("Building your first demo"),Ce=u(),z=r("p"),wt=s("Let\u2019s start by installing Gradio! Since it is a Python package, simply run:"),Le=u(),B=r("p"),me=r("code"),yt=s("$ pip install gradio"),He=u(),K=r("p"),gt=s(`You can run Gradio anywhere, be it from your favourite Python IDE, to Jupyter notebooks or even in Google Colab \u{1F92F}!
So install Gradio wherever you run Python!`),Oe=u(),Q=r("p"),bt=s("Let\u2019s get started with a simple \u201CHello World\u201D example to get familiar with the Gradio syntax:"),De=u(),C(A.$$.fragment),Se=u(),V=r("p"),vt=s("Let\u2019s walk through the code above:"),Me=u(),b=r("ul"),g=r("li"),xt=s("First, we define a function called "),de=r("code"),kt=s("greet()"),_t=s(". In this case, it is a simple function that adds \u201CHello\u201D before your name, but it can be "),he=r("em"),Et=s("any"),$t=s(" Python function in general. For example, in machine learning applications, this function would "),we=r("em"),jt=s("call a model to make a prediction"),It=s(" on an input and return the output."),Pt=u(),m=r("li"),Gt=s("Then, we create a Gradio "),ye=r("code"),qt=s("Interface"),Tt=s(" with three arguments, "),ge=r("code"),Ct=s("fn"),Lt=s(", "),be=r("code"),Ht=s("inputs"),Ot=s(", and "),ve=r("code"),Dt=s("outputs"),St=s(". These arguments define the prediction function, as well as the "),xe=r("em"),Mt=s("type"),At=s(" of input and output components we would like. In our case, both components are simple text boxes."),Ft=u(),_=r("li"),Nt=s("We then call the "),ke=r("code"),Wt=s("launch()"),Yt=s(" method on the "),_e=r("code"),Jt=s("Interface"),Rt=s(" that we created."),Ae=u(),j=r("p"),Ut=s("If you run this code, the interface below will appear automatically within a Jupyter/Colab notebook, or pop in a browser on "),Ee=r("strong"),F=r("a"),zt=s("http://localhost:7860"),Bt=s(" if running from a script."),Fe=u(),d=r("iframe"),Ne=u(),X=r("p"),Kt=s("Try using this GUI right now with your own name or some other input!"),We=u(),I=r("p"),Qt=s("You\u2019ll notice that in this GUI, Gradio automatically inferred the name of the input parameter ("),$e=r("code"),Vt=s("name"),Xt=s(`)
and applied it as a label on top of the textbox. What if you\u2019d like to change that?
Or if you\u2019d like to customize the textbox in some other way? In that case, you can
instantiate a class object representing the input component.`),Ye=u(),Z=r("p"),Zt=s("Take a look at the example below:"),Je=u(),C(N.$$.fragment),Re=u(),h=r("iframe"),Ue=u(),ee=r("p"),ea=s(`Here, we\u2019ve created an input textbox with a label, a placeholder, and a set number of lines.
You could do the same for the output textbox, but we\u2019ll leave that for now.`),ze=u(),te=r("p"),ta=s(`We\u2019ve seen that with just a few lines of code, Gradio lets you create a simple interface around any function
with any kind of inputs or outputs. In this section, we\u2019ve started with a
simple textbox, but in the next sections, we\u2019ll cover other kinds of inputs and outputs. Let\u2019s now take a look at including some NLP in a Gradio application.`),Be=u(),E=r("h2"),P=r("a"),je=r("span"),C(W.$$.fragment),aa=u(),Ie=r("span"),oa=s("\u{1F916} Including model predictions"),Ke=u(),G=r("p"),sa=s("Let\u2019s now build a simple interface that allows you to demo a "),Pe=r("strong"),la=s("text-generation"),na=s(" model like GPT-2."),Qe=u(),v=r("p"),ra=s("We\u2019ll load our model using the "),Ge=r("code"),ia=s("pipeline()"),pa=s(` function from \u{1F917} Transformers.
If you need a quick refresher, you can go back to `),ae=r("a"),ua=s("that section in Chapter 1"),ca=s("."),Ve=u(),oe=r("p"),fa=s("First, we define a prediction function that takes in a text prompt and returns the text completion:"),Xe=u(),C(Y.$$.fragment),Ze=u(),se=r("p"),ma=s("This function completes prompts that you provide, and you can run it with your own input prompts to see how it works. Here is an example (you might get a different completion):"),et=u(),C(J.$$.fragment),tt=u(),C(R.$$.fragment),at=u(),q=r("p"),da=s("Now that we have a function for generating predictions, we can create and launch an "),qe=r("code"),ha=s("Interface"),wa=s(" in the same way we did earlier:"),ot=u(),C(U.$$.fragment),st=u(),le=r("p"),ya=s("That\u2019s it! You can now use this interface to generate text using the GPT-2 model as shown below \u{1F92F}."),lt=u(),w=r("iframe"),nt=u(),ne=r("p"),ga=s("Keep reading to see how to build other kinds of demos with Gradio!"),this.h()},l(e){const o=co('[data-svelte="svelte-1phssyn"]',document.head);x=i(o,"META",{name:!0,content:!0}),o.forEach(t),Te=c(e),k=i(e,"H1",{class:!0});var it=p(k);$=i(it,"A",{id:!0,class:!0,href:!0});var Ea=p($);ce=i(Ea,"SPAN",{});var $a=p(ce);L(M.$$.fragment,$a),$a.forEach(t),Ea.forEach(t),dt=c(it),fe=i(it,"SPAN",{});var ja=p(fe);ht=l(ja,"Building your first demo"),ja.forEach(t),it.forEach(t),Ce=c(e),z=i(e,"P",{});var Ia=p(z);wt=l(Ia,"Let\u2019s start by installing Gradio! Since it is a Python package, simply run:"),Ia.forEach(t),Le=c(e),B=i(e,"P",{});var Pa=p(B);me=i(Pa,"CODE",{});var Ga=p(me);yt=l(Ga,"$ pip install gradio"),Ga.forEach(t),Pa.forEach(t),He=c(e),K=i(e,"P",{});var qa=p(K);gt=l(qa,`You can run Gradio anywhere, be it from your favourite Python IDE, to Jupyter notebooks or even in Google Colab \u{1F92F}!
So install Gradio wherever you run Python!`),qa.forEach(t),Oe=c(e),Q=i(e,"P",{});var Ta=p(Q);bt=l(Ta,"Let\u2019s get started with a simple \u201CHello World\u201D example to get familiar with the Gradio syntax:"),Ta.forEach(t),De=c(e),L(A.$$.fragment,e),Se=c(e),V=i(e,"P",{});var Ca=p(V);vt=l(Ca,"Let\u2019s walk through the code above:"),Ca.forEach(t),Me=c(e),b=i(e,"UL",{});var re=p(b);g=i(re,"LI",{});var T=p(g);xt=l(T,"First, we define a function called "),de=i(T,"CODE",{});var La=p(de);kt=l(La,"greet()"),La.forEach(t),_t=l(T,". In this case, it is a simple function that adds \u201CHello\u201D before your name, but it can be "),he=i(T,"EM",{});var Ha=p(he);Et=l(Ha,"any"),Ha.forEach(t),$t=l(T," Python function in general. For example, in machine learning applications, this function would "),we=i(T,"EM",{});var Oa=p(we);jt=l(Oa,"call a model to make a prediction"),Oa.forEach(t),It=l(T," on an input and return the output."),T.forEach(t),Pt=c(re),m=i(re,"LI",{});var y=p(m);Gt=l(y,"Then, we create a Gradio "),ye=i(y,"CODE",{});var Da=p(ye);qt=l(Da,"Interface"),Da.forEach(t),Tt=l(y," with three arguments, "),ge=i(y,"CODE",{});var Sa=p(ge);Ct=l(Sa,"fn"),Sa.forEach(t),Lt=l(y,", "),be=i(y,"CODE",{});var Ma=p(be);Ht=l(Ma,"inputs"),Ma.forEach(t),Ot=l(y,", and "),ve=i(y,"CODE",{});var Aa=p(ve);Dt=l(Aa,"outputs"),Aa.forEach(t),St=l(y,". These arguments define the prediction function, as well as the "),xe=i(y,"EM",{});var Fa=p(xe);Mt=l(Fa,"type"),Fa.forEach(t),At=l(y," of input and output components we would like. In our case, both components are simple text boxes."),y.forEach(t),Ft=c(re),_=i(re,"LI",{});var ie=p(_);Nt=l(ie,"We then call the "),ke=i(ie,"CODE",{});var Na=p(ke);Wt=l(Na,"launch()"),Na.forEach(t),Yt=l(ie," method on the "),_e=i(ie,"CODE",{});var Wa=p(_e);Jt=l(Wa,"Interface"),Wa.forEach(t),Rt=l(ie," that we created."),ie.forEach(t),re.forEach(t),Ae=c(e),j=i(e,"P",{});var pt=p(j);Ut=l(pt,"If you run this code, the interface below will appear automatically within a Jupyter/Colab notebook, or pop in a browser on "),Ee=i(pt,"STRONG",{});var Ya=p(Ee);F=i(Ya,"A",{href:!0,rel:!0});var Ja=p(F);zt=l(Ja,"http://localhost:7860"),Ja.forEach(t),Ya.forEach(t),Bt=l(pt," if running from a script."),pt.forEach(t),Fe=c(e),d=i(e,"IFRAME",{src:!0,frameborder:!0,height:!0,title:!0,class:!0,allow:!0,sandbox:!0}),p(d).forEach(t),Ne=c(e),X=i(e,"P",{});var Ra=p(X);Kt=l(Ra,"Try using this GUI right now with your own name or some other input!"),Ra.forEach(t),We=c(e),I=i(e,"P",{});var ut=p(I);Qt=l(ut,"You\u2019ll notice that in this GUI, Gradio automatically inferred the name of the input parameter ("),$e=i(ut,"CODE",{});var Ua=p($e);Vt=l(Ua,"name"),Ua.forEach(t),Xt=l(ut,`)
and applied it as a label on top of the textbox. What if you\u2019d like to change that?
Or if you\u2019d like to customize the textbox in some other way? In that case, you can
instantiate a class object representing the input component.`),ut.forEach(t),Ye=c(e),Z=i(e,"P",{});var za=p(Z);Zt=l(za,"Take a look at the example below:"),za.forEach(t),Je=c(e),L(N.$$.fragment,e),Re=c(e),h=i(e,"IFRAME",{src:!0,frameborder:!0,height:!0,title:!0,class:!0,allow:!0,sandbox:!0}),p(h).forEach(t),Ue=c(e),ee=i(e,"P",{});var Ba=p(ee);ea=l(Ba,`Here, we\u2019ve created an input textbox with a label, a placeholder, and a set number of lines.
You could do the same for the output textbox, but we\u2019ll leave that for now.`),Ba.forEach(t),ze=c(e),te=i(e,"P",{});var Ka=p(te);ta=l(Ka,`We\u2019ve seen that with just a few lines of code, Gradio lets you create a simple interface around any function
with any kind of inputs or outputs. In this section, we\u2019ve started with a
simple textbox, but in the next sections, we\u2019ll cover other kinds of inputs and outputs. Let\u2019s now take a look at including some NLP in a Gradio application.`),Ka.forEach(t),Be=c(e),E=i(e,"H2",{class:!0});var ct=p(E);P=i(ct,"A",{id:!0,class:!0,href:!0});var Qa=p(P);je=i(Qa,"SPAN",{});var Va=p(je);L(W.$$.fragment,Va),Va.forEach(t),Qa.forEach(t),aa=c(ct),Ie=i(ct,"SPAN",{});var Xa=p(Ie);oa=l(Xa,"\u{1F916} Including model predictions"),Xa.forEach(t),ct.forEach(t),Ke=c(e),G=i(e,"P",{});var ft=p(G);sa=l(ft,"Let\u2019s now build a simple interface that allows you to demo a "),Pe=i(ft,"STRONG",{});var Za=p(Pe);la=l(Za,"text-generation"),Za.forEach(t),na=l(ft," model like GPT-2."),ft.forEach(t),Qe=c(e),v=i(e,"P",{});var pe=p(v);ra=l(pe,"We\u2019ll load our model using the "),Ge=i(pe,"CODE",{});var eo=p(Ge);ia=l(eo,"pipeline()"),eo.forEach(t),pa=l(pe,` function from \u{1F917} Transformers.
If you need a quick refresher, you can go back to `),ae=i(pe,"A",{href:!0});var to=p(ae);ua=l(to,"that section in Chapter 1"),to.forEach(t),ca=l(pe,"."),pe.forEach(t),Ve=c(e),oe=i(e,"P",{});var ao=p(oe);fa=l(ao,"First, we define a prediction function that takes in a text prompt and returns the text completion:"),ao.forEach(t),Xe=c(e),L(Y.$$.fragment,e),Ze=c(e),se=i(e,"P",{});var oo=p(se);ma=l(oo,"This function completes prompts that you provide, and you can run it with your own input prompts to see how it works. Here is an example (you might get a different completion):"),oo.forEach(t),et=c(e),L(J.$$.fragment,e),tt=c(e),L(R.$$.fragment,e),at=c(e),q=i(e,"P",{});var mt=p(q);da=l(mt,"Now that we have a function for generating predictions, we can create and launch an "),qe=i(mt,"CODE",{});var so=p(qe);ha=l(so,"Interface"),so.forEach(t),wa=l(mt," in the same way we did earlier:"),mt.forEach(t),ot=c(e),L(U.$$.fragment,e),st=c(e),le=i(e,"P",{});var lo=p(le);ya=l(lo,"That\u2019s it! You can now use this interface to generate text using the GPT-2 model as shown below \u{1F92F}."),lo.forEach(t),lt=c(e),w=i(e,"IFRAME",{src:!0,frameborder:!0,height:!0,title:!0,class:!0,allow:!0,sandbox:!0}),p(w).forEach(t),nt=c(e),ne=i(e,"P",{});var no=p(ne);ga=l(no,"Keep reading to see how to build other kinds of demos with Gradio!"),no.forEach(t),this.h()},h(){f(x,"name","hf:doc:metadata"),f(x,"content",JSON.stringify(wo)),f($,"id","building-your-first-demo"),f($,"class","header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full"),f($,"href","#building-your-first-demo"),f(k,"class","relative group"),f(F,"href","http://localhost:7860/"),f(F,"rel","nofollow"),ba(d.src,xa="https://hf.space/gradioiframe/course-demos/hello-world/+")||f(d,"src",xa),f(d,"frameborder","0"),f(d,"height","250"),f(d,"title","Gradio app"),f(d,"class","container p-0 flex-grow space-iframe"),f(d,"allow","accelerometer; ambient-light-sensor; autoplay; battery; camera; document-domain; encrypted-media; fullscreen; geolocation; gyroscope; layout-animations; legacy-image-formats; magnetometer; microphone; midi; oversized-images; payment; picture-in-picture; publickey-credentials-get; sync-xhr; usb; vr ; wake-lock; xr-spatial-tracking"),f(d,"sandbox","allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-downloads"),ba(h.src,ka="https://hf.space/gradioiframe/course-demos/hello-world-custom/+")||f(h,"src",ka),f(h,"frameborder","0"),f(h,"height","300"),f(h,"title","Gradio app"),f(h,"class","container p-0 flex-grow space-iframe"),f(h,"allow","accelerometer; ambient-light-sensor; autoplay; battery; camera; document-domain; encrypted-media; fullscreen; geolocation; gyroscope; layout-animations; legacy-image-formats; magnetometer; microphone; midi; oversized-images; payment; picture-in-picture; publickey-credentials-get; sync-xhr; usb; vr ; wake-lock; xr-spatial-tracking"),f(h,"sandbox","allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-downloads"),f(P,"id","including-model-predictions"),f(P,"class","header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full"),f(P,"href","#including-model-predictions"),f(E,"class","relative group"),f(ae,"href","/course/chapter1/3#text-generation"),ba(w.src,_a="https://hf.space/gradioiframe/course-demos/gpt-2/+")||f(w,"src",_a),f(w,"frameborder","0"),f(w,"height","250"),f(w,"title","Gradio app"),f(w,"class","container p-0 flex-grow space-iframe"),f(w,"allow","accelerometer; ambient-light-sensor; autoplay; battery; camera; document-domain; encrypted-media; fullscreen; geolocation; gyroscope; layout-animations; legacy-image-formats; magnetometer; microphone; midi; oversized-images; payment; picture-in-picture; publickey-credentials-get; sync-xhr; usb; vr ; wake-lock; xr-spatial-tracking"),f(w,"sandbox","allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-downloads")},m(e,o){a(document.head,x),n(e,Te,o),n(e,k,o),a(k,$),a($,ce),H(M,ce,null),a(k,dt),a(k,fe),a(fe,ht),n(e,Ce,o),n(e,z,o),a(z,wt),n(e,Le,o),n(e,B,o),a(B,me),a(me,yt),n(e,He,o),n(e,K,o),a(K,gt),n(e,Oe,o),n(e,Q,o),a(Q,bt),n(e,De,o),H(A,e,o),n(e,Se,o),n(e,V,o),a(V,vt),n(e,Me,o),n(e,b,o),a(b,g),a(g,xt),a(g,de),a(de,kt),a(g,_t),a(g,he),a(he,Et),a(g,$t),a(g,we),a(we,jt),a(g,It),a(b,Pt),a(b,m),a(m,Gt),a(m,ye),a(ye,qt),a(m,Tt),a(m,ge),a(ge,Ct),a(m,Lt),a(m,be),a(be,Ht),a(m,Ot),a(m,ve),a(ve,Dt),a(m,St),a(m,xe),a(xe,Mt),a(m,At),a(b,Ft),a(b,_),a(_,Nt),a(_,ke),a(ke,Wt),a(_,Yt),a(_,_e),a(_e,Jt),a(_,Rt),n(e,Ae,o),n(e,j,o),a(j,Ut),a(j,Ee),a(Ee,F),a(F,zt),a(j,Bt),n(e,Fe,o),n(e,d,o),n(e,Ne,o),n(e,X,o),a(X,Kt),n(e,We,o),n(e,I,o),a(I,Qt),a(I,$e),a($e,Vt),a(I,Xt),n(e,Ye,o),n(e,Z,o),a(Z,Zt),n(e,Je,o),H(N,e,o),n(e,Re,o),n(e,h,o),n(e,Ue,o),n(e,ee,o),a(ee,ea),n(e,ze,o),n(e,te,o),a(te,ta),n(e,Be,o),n(e,E,o),a(E,P),a(P,je),H(W,je,null),a(E,aa),a(E,Ie),a(Ie,oa),n(e,Ke,o),n(e,G,o),a(G,sa),a(G,Pe),a(Pe,la),a(G,na),n(e,Qe,o),n(e,v,o),a(v,ra),a(v,Ge),a(Ge,ia),a(v,pa),a(v,ae),a(ae,ua),a(v,ca),n(e,Ve,o),n(e,oe,o),a(oe,fa),n(e,Xe,o),H(Y,e,o),n(e,Ze,o),n(e,se,o),a(se,ma),n(e,et,o),H(J,e,o),n(e,tt,o),H(R,e,o),n(e,at,o),n(e,q,o),a(q,da),a(q,qe),a(qe,ha),a(q,wa),n(e,ot,o),H(U,e,o),n(e,st,o),n(e,le,o),a(le,ya),n(e,lt,o),n(e,w,o),n(e,nt,o),n(e,ne,o),a(ne,ga),rt=!0},p:fo,i(e){rt||(O(M.$$.fragment,e),O(A.$$.fragment,e),O(N.$$.fragment,e),O(W.$$.fragment,e),O(Y.$$.fragment,e),O(J.$$.fragment,e),O(R.$$.fragment,e),O(U.$$.fragment,e),rt=!0)},o(e){D(M.$$.fragment,e),D(A.$$.fragment,e),D(N.$$.fragment,e),D(W.$$.fragment,e),D(Y.$$.fragment,e),D(J.$$.fragment,e),D(R.$$.fragment,e),D(U.$$.fragment,e),rt=!1},d(e){t(x),e&&t(Te),e&&t(k),S(M),e&&t(Ce),e&&t(z),e&&t(Le),e&&t(B),e&&t(He),e&&t(K),e&&t(Oe),e&&t(Q),e&&t(De),S(A,e),e&&t(Se),e&&t(V),e&&t(Me),e&&t(b),e&&t(Ae),e&&t(j),e&&t(Fe),e&&t(d),e&&t(Ne),e&&t(X),e&&t(We),e&&t(I),e&&t(Ye),e&&t(Z),e&&t(Je),S(N,e),e&&t(Re),e&&t(h),e&&t(Ue),e&&t(ee),e&&t(ze),e&&t(te),e&&t(Be),e&&t(E),S(W),e&&t(Ke),e&&t(G),e&&t(Qe),e&&t(v),e&&t(Ve),e&&t(oe),e&&t(Xe),S(Y,e),e&&t(Ze),e&&t(se),e&&t(et),S(J,e),e&&t(tt),S(R,e),e&&t(at),e&&t(q),e&&t(ot),S(U,e),e&&t(st),e&&t(le),e&&t(lt),e&&t(w),e&&t(nt),e&&t(ne)}}}const wo={local:"building-your-first-demo",sections:[{local:"including-model-predictions",title:"\u{1F916} Including model predictions"}],title:"Building your first demo"};function yo(va){return mo(()=>{new URLSearchParams(window.location.search).get("fw")}),[]}class xo extends io{constructor(x){super();po(this,x,yo,ho,uo,{})}}export{xo as default,wo as metadata};
