course/pr_1190/ru/_app/immutable/nodes/72.ec0043a8.js

import{s as tl,a as ll,n as sl,o as al}from"../chunks/scheduler.893fe8c9.js";import{S as nl,i as il,e as i,s as a,c as m,h as ol,a as o,d as t,b as n,f as Se,g as u,j as p,k as r,l as pl,m as s,n as y,t as d,o as J,p as T}from"../chunks/index.2d09ebb4.js";import{C as rl,H as K,E as cl}from"../chunks/MermaidChart.svelte_svelte_type_style_lang.e1f3f4cd.js";import{Y as Ml}from"../chunks/Youtube.b7012d06.js";import{C as We}from"../chunks/CodeBlock.3e45a446.js";import{C as ml}from"../chunks/CourseFloatingBanner.e3aeab73.js";function ul(Ze){let U,P,A,O,w,ee,g,le,b,te,j,xe=`Теперь, когда вы создали демо, вы наверняка захотите поделиться им с другими. Демо Gradio
можно распространять двумя способами: используя <strong><em>временную ссылку для общего доступа</em></strong> или <strong><em>постоянный хостинг на Spaces</em></strong>.`,se,f,Qe="Мы рассмотрим оба этих подхода в ближайшее время. Но прежде чем выложить свое демо, вы, возможно, захотите доработать его 💅.",ae,C,ne,h,He='<img class="block dark:hidden" src="https://huggingface.co/datasets/huggingface-course/documentation-images/resolve/main/en/chapter9/gradio-demo-overview.png" alt="Overview of a gradio interface"/> <img class="hidden dark:block" src="https://huggingface.co/datasets/huggingface-course/documentation-images/resolve/main/en/chapter9/gradio-demo-overview-dark.png" alt="Overview of a gradio interface"/>',ie,I,Ye="Чтобы добавить дополнительный контент в демо, класс <code>Interface</code> поддерживает некоторые необязательные параметры:",oe,k,Fe=`<li><code>title</code>: вы можете дать название своему демо, которое будет отображаться <em>над</em> компонентами ввода и вывода.</li> <li><code>description</code>: вы можете дать описание (в виде текста, Markdown или HTML) для интерфейса, которое отображается над компонентами ввода и вывода и под заголовком.</li> <li><code>article</code>: вы также можете написать расширенную статью (в текстовом формате, Markdown или HTML), объясняющую интерфейс. Если она задана, она отображается <em>под</em> компонентами ввода и вывода.</li> <li><code>theme</code>: не нравятся цвета по умолчанию? Установите для темы одно из значений <code>default</code>, <code>huggingface</code>, <code>grass</code>, <code>peach</code>. Вы также можете добавить префикс <code>dark-</code>, например, <code>dark-peach</code> для темной темы (или просто <code>dark</code> для темной темы по умолчанию).</li> <li><code>examples</code>: чтобы сделать ваше демо более удобным в использовании, вы можете предоставить несколько примеров входов для функции. Они появляются под компонентами пользовательского интерфейса и могут быть использованы для заполнения интерфейса. Они должны быть предоставлены в виде вложенного списка, в котором внешний список состоит из примеров, а каждый внутренний список состоит из ввода, соответствующего каждому компоненту ввода.</li> <li><code>live</code>: если вы хотите сделать демо “живым”, то есть чтобы ваша модель запускалась заново при каждом изменении входных данных, вы можете установить <code>live=True</code>. Это имеет смысл использовать с быстрыми моделями (пример мы увидим в конце этого раздела)
Используя приведенные выше варианты, мы получим более завершенный интерфейс. Запустите приведенный ниже код, и вы сможете пообщаться с Риком и Морти:</li>`,pe,B,re,v,_e="Используя приведенные выше варианты, мы получим более завершенный интерфейс. Попробуйте интерфейс, представленный ниже:",ce,c,ze,Me,G,me,$,Le=`Теперь, когда у нас есть работающее демо нашей модели машинного обучения, давайте узнаем, как легко поделиться ссылкой на наш интерфейс.
Интерфейсами можно легко поделиться публично, установив <code>share=True</code> в методе <code>launch()</code>:`,ue,R,ye,S,Ee="В результате создается общедоступная ссылка, которую вы можете отправить кому угодно! Когда вы отправляете эту ссылку, пользователь на другой стороне может опробовать модель в своем браузере в течение 72 часов. Поскольку обработка происходит на вашем устройстве (пока оно включено!), вам не нужно беспокоиться об упаковке каких-либо зависимостей. Если вы работаете в блокноте Google Colab, ссылка на общий доступ всегда создается автоматически. Обычно она выглядит примерно так: <strong>XXXXX.gradio.app</strong>. Хотя ссылка предоставляется через Gradio, мы являемся лишь прокси для вашего локального сервера и не храним никаких данных, передаваемых через интерфейсы.",de,W,Ne="Однако не забывайте, что эти ссылки общедоступны, а значит, любой желающий может использовать вашу модель для прогнозирования! Поэтому не раскрывайте конфиденциальную информацию через написанные вами функции и не допускайте критических изменений на вашем устройстве. Если вы установите <code>share=False</code> (по умолчанию), будет создана только локальная ссылка.",Je,Z,Te,x,Ve="Ссылка на ресурс, которую можно передать коллегам, - это здорово, но как разместить демо на постоянном хостинге, чтобы оно существовало в своем собственном “пространстве (space)” в Интернете?",Ue,Q,qe=`Hugging Face Spaces предоставляет инфраструктуру для постоянного размещения вашей модели Gradio в интернете, <strong>бесплатно</strong>! Spaces позволяет вам создать и разместить в (публичном или частном) репозитории,
где ваш Gradio
код интерфейса будет существовать в файле <code>app.py</code>. <a href="https://huggingface.co/blog/gradio-spaces" rel="nofollow">Прочитайте пошаговое руководство</a> чтобы начать работу, или посмотрите видео с примером ниже.`,he,H,we,Y,ge,F,Xe='Используя то, что мы узнали в предыдущих разделах, давайте создадим демо распознавания скетчей, которое мы видели в <a href="../chapter9/1">первом разделе этой главы</a>. Давайте добавим некоторые настройки в наш интерфейс и установим <code>share=True</code>, чтобы создать публичную ссылку, которую мы сможем передавать всем желающим.',be,_,Ae='Мы можем загрузить метки из файла <a href="https://huggingface.co/spaces/dawood/Sketch-Recognition/blob/main/class_names.txt" rel="nofollow">class_names.txt</a> и загрузить предварительно обученную модель pytorch из файла <a href="https://huggingface.co/spaces/dawood/Sketch-Recognition/blob/main/pytorch_model.bin" rel="nofollow">pytorch_model.bin</a>. Загрузите эти файлы, перейдя по ссылке и нажав кнопку загрузки в левом верхнем углу окна предварительного просмотра файла. Давайте посмотрим на приведенный ниже код, чтобы увидеть, как мы используем эти файлы для загрузки нашей модели и создания функции <code>predict()</code>:',je,z,fe,L,De="Теперь у нас есть функция <code>predict()</code>. Следующим шагом будет определение и запуск нашего интерфейса Gradio:",Ce,E,Ie,M,Ke,ke,N,Pe=`Обратите внимание на параметр <code>live=True</code> в <code>Interface</code>, который означает, что демо скетча делает
предсказание каждый раз, когда кто-то рисует на скетчпаде (без кнопки “Исполнить (submit)”!).`,Be,V,Oe=`Кроме того, мы также установили аргумент <code>share=True</code> в методе <code>launch()</code>.
Это создаст общедоступную ссылку, которую вы можете
отправить кому угодно! Когда вы отправите эту ссылку, пользователь на другой стороне сможет опробовать
модель распознавания эскизов. Повторим, что модель также можно разместить на Hugging Face Spaces,
именно так мы и разместили демо выше.`,ve,q,el="Далее мы расскажем о других способах использования Gradio в экосистеме Hugging Face!",Ge,X,$e,D,Re;return w=new rl({props:{containerStyle:"float: right; margin-left: 10px; display: inline-flex; position: relative; z-index: 10;"}}),g=new K({props:{title:"Делимся демо с другими",local:"sharing-demos-with-others",headingTag:"h1"}}),b=new ml({props:{chapter:9,classNames:"absolute z-10 right-0 top-0",notebooks:[{label:"Google Colab",value:"https://colab.research.google.com/github/huggingface/notebooks/blob/master/course/en/chapter9/section4.ipynb"},{label:"Aws Studio",value:"https://studiolab.sagemaker.aws/import/github/huggingface/notebooks/blob/master/course/en/chapter9/section4.ipynb"}]}}),C=new K({props:{title:"Доработка демо Gradio:",local:"polishing-your-gradio-demo",headingTag:"h3"}}),B=new We({props:{code:"dGl0bGUlMjAlM0QlMjAlMjJBc2slMjBSaWNrJTIwYSUyMFF1ZXN0aW9uJTIyJTBBZGVzY3JpcHRpb24lMjAlM0QlMjAlMjIlMjIlMjIlMEFUaGUlMjBib3QlMjB3YXMlMjB0cmFpbmVkJTIwdG8lMjBhbnN3ZXIlMjBxdWVzdGlvbnMlMjBiYXNlZCUyMG9uJTIwUmljayUyMGFuZCUyME1vcnR5JTIwZGlhbG9ndWVzLiUyMEFzayUyMFJpY2slMjBhbnl0aGluZyElMEElM0NpbWclMjBzcmMlM0QlMjJodHRwcyUzQSUyRiUyRmh1Z2dpbmdmYWNlLmNvJTJGc3BhY2VzJTJGY291cnNlLWRlbW9zJTJGUmlja19hbmRfTW9ydHlfUUElMkZyZXNvbHZlJTJGbWFpbiUyRnJpY2sucG5nJTIyJTIwd2lkdGglM0QyMDBweCUzRSUwQSUyMiUyMiUyMiUwQSUwQWFydGljbGUlMjAlM0QlMjAlMjJDaGVjayUyMG91dCUyMCU1QnRoZSUyMG9yaWdpbmFsJTIwUmljayUyMGFuZCUyME1vcnR5JTIwQm90JTVEKGh0dHBzJTNBJTJGJTJGaHVnZ2luZ2ZhY2UuY28lMkZzcGFjZXMlMkZraW5nYWJ6cHJvJTJGUmlja19hbmRfTW9ydHlfQm90KSUyMHRoYXQlMjB0aGlzJTIwZGVtbyUyMGlzJTIwYmFzZWQlMjBvZmYlMjBvZi4lMjIlMEElMEFnci5JbnRlcmZhY2UoJTBBJTIwJTIwJTIwJTIwZm4lM0RwcmVkaWN0JTJDJTBBJTIwJTIwJTIwJTIwaW5wdXRzJTNEJTIydGV4dGJveCUyMiUyQyUwQSUyMCUyMCUyMCUyMG91dHB1dHMlM0QlMjJ0ZXh0JTIyJTJDJTBBJTIwJTIwJTIwJTIwdGl0bGUlM0R0aXRsZSUyQyUwQSUyMCUyMCUyMCUyMGRlc2NyaXB0aW9uJTNEZGVzY3JpcHRpb24lMkMlMEElMjAlMjAlMjAlMjBhcnRpY2xlJTNEYXJ0aWNsZSUyQyUwQSUyMCUyMCUyMCUyMGV4YW1wbGVzJTNEJTVCJTVCJTIyV2hhdCUyMGFyZSUyMHlvdSUyMGRvaW5nJTNGJTIyJTVEJTJDJTIwJTVCJTIyV2hlcmUlMjBzaG91bGQlMjB3ZSUyMHRpbWUlMjB0cmF2ZWwlMjB0byUzRiUyMiU1RCU1RCUyQyUwQSkubGF1bmNoKCk=",highlighted:`title = <span class="hljs-string">&quot;Ask Rick a Question&quot;</span>
description = <span class="hljs-string">&quot;&quot;&quot;
The bot was trained to answer questions based on Rick and Morty dialogues. Ask Rick anything!
&lt;img src=&quot;https://huggingface.co/spaces/course-demos/Rick_and_Morty_QA/resolve/main/rick.png&quot; width=200px&gt;
&quot;&quot;&quot;</span>

article = <span class="hljs-string">&quot;Check out [the original Rick and Morty Bot](https://huggingface.co/spaces/kingabzpro/Rick_and_Morty_Bot) that this demo is based off of.&quot;</span>

gr.Interface(
    fn=predict,
    inputs=<span class="hljs-string">&quot;textbox&quot;</span>,
    outputs=<span class="hljs-string">&quot;text&quot;</span>,
    title=title,
    description=description,
    article=article,
    examples=[[<span class="hljs-string">&quot;What are you doing?&quot;</span>], [<span class="hljs-string">&quot;Where should we time travel to?&quot;</span>]],
).launch()`,wrap:!1}}),G=new K({props:{title:"Распространение демо с помощью временных ссылок",local:"sharing-your-demo-with-temporary-links",headingTag:"h3"}}),R=new We({props:{code:"Z3IuSW50ZXJmYWNlKGNsYXNzaWZ5X2ltYWdlJTJDJTIwJTIyaW1hZ2UlMjIlMkMlMjAlMjJsYWJlbCUyMikubGF1bmNoKHNoYXJlJTNEVHJ1ZSk=",highlighted:'gr.Interface(classify_image, <span class="hljs-string">&quot;image&quot;</span>, <span class="hljs-string">&quot;label&quot;</span>).launch(share=<span class="hljs-literal">True</span>)',wrap:!1}}),Z=new K({props:{title:"Хостинг вашего демо на Hugging Face Spaces",local:"hosting-your-demo-on-hugging-face-spaces",headingTag:"h3"}}),H=new Ml({props:{id:"LS9Y2wDVI0k"}}),Y=new K({props:{title:"✏️ Давайте применим это!",local:"lets-apply-it",headingTag:"h2"}}),z=new We({props:{code:"ZnJvbSUyMHBhdGhsaWIlMjBpbXBvcnQlMjBQYXRoJTBBaW1wb3J0JTIwdG9yY2glMEFpbXBvcnQlMjBncmFkaW8lMjBhcyUyMGdyJTBBZnJvbSUyMHRvcmNoJTIwaW1wb3J0JTIwbm4lMEElMEFMQUJFTFMlMjAlM0QlMjBQYXRoKCUyMmNsYXNzX25hbWVzLnR4dCUyMikucmVhZF90ZXh0KCkuc3BsaXRsaW5lcygpJTBBJTBBbW9kZWwlMjAlM0QlMjBubi5TZXF1ZW50aWFsKCUwQSUyMCUyMCUyMCUyMG5uLkNvbnYyZCgxJTJDJTIwMzIlMkMlMjAzJTJDJTIwcGFkZGluZyUzRCUyMnNhbWUlMjIpJTJDJTBBJTIwJTIwJTIwJTIwbm4uUmVMVSgpJTJDJTBBJTIwJTIwJTIwJTIwbm4uTWF4UG9vbDJkKDIpJTJDJTBBJTIwJTIwJTIwJTIwbm4uQ29udjJkKDMyJTJDJTIwNjQlMkMlMjAzJTJDJTIwcGFkZGluZyUzRCUyMnNhbWUlMjIpJTJDJTBBJTIwJTIwJTIwJTIwbm4uUmVMVSgpJTJDJTBBJTIwJTIwJTIwJTIwbm4uTWF4UG9vbDJkKDIpJTJDJTBBJTIwJTIwJTIwJTIwbm4uQ29udjJkKDY0JTJDJTIwMTI4JTJDJTIwMyUyQyUyMHBhZGRpbmclM0QlMjJzYW1lJTIyKSUyQyUwQSUyMCUyMCUyMCUyMG5uLlJlTFUoKSUyQyUwQSUyMCUyMCUyMCUyMG5uLk1heFBvb2wyZCgyKSUyQyUwQSUyMCUyMCUyMCUyMG5uLkZsYXR0ZW4oKSUyQyUwQSUyMCUyMCUyMCUyMG5uLkxpbmVhcigxMTUyJTJDJTIwMjU2KSUyQyUwQSUyMCUyMCUyMCUyMG5uLlJlTFUoKSUyQyUwQSUyMCUyMCUyMCUyMG5uLkxpbmVhcigyNTYlMkMlMjBsZW4oTEFCRUxTKSklMkMlMEEpJTBBc3RhdGVfZGljdCUyMCUzRCUyMHRvcmNoLmxvYWQoJTIycHl0b3JjaF9tb2RlbC5iaW4lMjIlMkMlMjBtYXBfbG9jYXRpb24lM0QlMjJjcHUlMjIpJTBBbW9kZWwubG9hZF9zdGF0ZV9kaWN0KHN0YXRlX2RpY3QlMkMlMjBzdHJpY3QlM0RGYWxzZSklMEFtb2RlbC5ldmFsKCklMEElMEElMEFkZWYlMjBwcmVkaWN0KGltKSUzQSUwQSUyMCUyMCUyMCUyMHglMjAlM0QlMjB0b3JjaC50ZW5zb3IoaW0lMkMlMjBkdHlwZSUzRHRvcmNoLmZsb2F0MzIpLnVuc3F1ZWV6ZSgwKS51bnNxdWVlemUoMCklMjAlMkYlMjAyNTUuMCUwQSUyMCUyMCUyMCUyMHdpdGglMjB0b3JjaC5ub19ncmFkKCklM0ElMEElMjAlMjAlMjAlMjAlMjAlMjAlMjAlMjBvdXQlMjAlM0QlMjBtb2RlbCh4KSUwQSUyMCUyMCUyMCUyMHByb2JhYmlsaXRpZXMlMjAlM0QlMjB0b3JjaC5ubi5mdW5jdGlvbmFsLnNvZnRtYXgob3V0JTVCMCU1RCUyQyUyMGRpbSUzRDApJTBBJTIwJTIwJTIwJTIwdmFsdWVzJTJDJTIwaW5kaWNlcyUyMCUzRCUyMHRvcmNoLnRvcGsocHJvYmFiaWxpdGllcyUyQyUyMDUpJTBBJTIwJTIwJTIwJTIwcmV0dXJuJTIwJTdCTEFCRUxTJTVCaSU1RCUzQSUyMHYuaXRlbSgpJTIwZm9yJTIwaSUyQyUyMHYlMjBpbiUyMHppcChpbmRpY2VzJTJDJTIwdmFsdWVzKSU3RA==",highlighted:`<span class="hljs-keyword">from</span> pathlib <span class="hljs-keyword">import</span> Path
<span class="hljs-keyword">import</span> torch
<span class="hljs-keyword">import</span> gradio <span class="hljs-keyword">as</span> gr
<span class="hljs-keyword">from</span> torch <span class="hljs-keyword">import</span> nn

LABELS = Path(<span class="hljs-string">&quot;class_names.txt&quot;</span>).read_text().splitlines()

model = nn.Sequential(
    nn.Conv2d(<span class="hljs-number">1</span>, <span class="hljs-number">32</span>, <span class="hljs-number">3</span>, padding=<span class="hljs-string">&quot;same&quot;</span>),
    nn.ReLU(),
    nn.MaxPool2d(<span class="hljs-number">2</span>),
    nn.Conv2d(<span class="hljs-number">32</span>, <span class="hljs-number">64</span>, <span class="hljs-number">3</span>, padding=<span class="hljs-string">&quot;same&quot;</span>),
    nn.ReLU(),
    nn.MaxPool2d(<span class="hljs-number">2</span>),
    nn.Conv2d(<span class="hljs-number">64</span>, <span class="hljs-number">128</span>, <span class="hljs-number">3</span>, padding=<span class="hljs-string">&quot;same&quot;</span>),
    nn.ReLU(),
    nn.MaxPool2d(<span class="hljs-number">2</span>),
    nn.Flatten(),
    nn.Linear(<span class="hljs-number">1152</span>, <span class="hljs-number">256</span>),
    nn.ReLU(),
    nn.Linear(<span class="hljs-number">256</span>, <span class="hljs-built_in">len</span>(LABELS)),
)
state_dict = torch.load(<span class="hljs-string">&quot;pytorch_model.bin&quot;</span>, map_location=<span class="hljs-string">&quot;cpu&quot;</span>)
model.load_state_dict(state_dict, strict=<span class="hljs-literal">False</span>)
model.<span class="hljs-built_in">eval</span>()


<span class="hljs-keyword">def</span> <span class="hljs-title function_">predict</span>(<span class="hljs-params">im</span>):
    x = torch.tensor(im, dtype=torch.float32).unsqueeze(<span class="hljs-number">0</span>).unsqueeze(<span class="hljs-number">0</span>) / <span class="hljs-number">255.0</span>
    <span class="hljs-keyword">with</span> torch.no_grad():
        out = model(x)
    probabilities = torch.nn.functional.softmax(out[<span class="hljs-number">0</span>], dim=<span class="hljs-number">0</span>)
    values, indices = torch.topk(probabilities, <span class="hljs-number">5</span>)
    <span class="hljs-keyword">return</span> {LABELS[i]: v.item() <span class="hljs-keyword">for</span> i, v <span class="hljs-keyword">in</span> <span class="hljs-built_in">zip</span>(indices, values)}`,wrap:!1}}),E=new We({props:{code:"aW50ZXJmYWNlJTIwJTNEJTIwZ3IuSW50ZXJmYWNlKCUwQSUyMCUyMCUyMCUyMHByZWRpY3QlMkMlMEElMjAlMjAlMjAlMjBpbnB1dHMlM0QlMjJza2V0Y2hwYWQlMjIlMkMlMEElMjAlMjAlMjAlMjBvdXRwdXRzJTNEJTIybGFiZWwlMjIlMkMlMEElMjAlMjAlMjAlMjB0aGVtZSUzRCUyMmh1Z2dpbmdmYWNlJTIyJTJDJTBBJTIwJTIwJTIwJTIwdGl0bGUlM0QlMjJTa2V0Y2glMjBSZWNvZ25pdGlvbiUyMiUyQyUwQSUyMCUyMCUyMCUyMGRlc2NyaXB0aW9uJTNEJTIyV2hvJTIwd2FudHMlMjB0byUyMHBsYXklMjBQaWN0aW9uYXJ5JTNGJTIwRHJhdyUyMGElMjBjb21tb24lMjBvYmplY3QlMjBsaWtlJTIwYSUyMHNob3ZlbCUyMG9yJTIwYSUyMGxhcHRvcCUyQyUyMGFuZCUyMHRoZSUyMGFsZ29yaXRobSUyMHdpbGwlMjBndWVzcyUyMGluJTIwcmVhbCUyMHRpbWUhJTIyJTJDJTBBJTIwJTIwJTIwJTIwYXJ0aWNsZSUzRCUyMiUzQ3AlMjBzdHlsZSUzRCd0ZXh0LWFsaWduJTNBJTIwY2VudGVyJyUzRVNrZXRjaCUyMFJlY29nbml0aW9uJTIwJTdDJTIwRGVtbyUyME1vZGVsJTNDJTJGcCUzRSUyMiUyQyUwQSUyMCUyMCUyMCUyMGxpdmUlM0RUcnVlJTJDJTBBKSUwQWludGVyZmFjZS5sYXVuY2goc2hhcmUlM0RUcnVlKQ==",highlighted:`interface = gr.Interface(
    predict,
    inputs=<span class="hljs-string">&quot;sketchpad&quot;</span>,
    outputs=<span class="hljs-string">&quot;label&quot;</span>,
    theme=<span class="hljs-string">&quot;huggingface&quot;</span>,
    title=<span class="hljs-string">&quot;Sketch Recognition&quot;</span>,
    description=<span class="hljs-string">&quot;Who wants to play Pictionary? Draw a common object like a shovel or a laptop, and the algorithm will guess in real time!&quot;</span>,
    article=<span class="hljs-string">&quot;&lt;p style=&#x27;text-align: center&#x27;&gt;Sketch Recognition | Demo Model&lt;/p&gt;&quot;</span>,
    live=<span class="hljs-literal">True</span>,
)
interface.launch(share=<span class="hljs-literal">True</span>)`,wrap:!1}}),X=new cl({props:{source:"https://github.com/huggingface/course/blob/main/chapters/ru/chapter9/4.mdx"}}),{c(){U=i("meta"),P=a(),A=i("p"),O=a(),m(w.$$.fragment),ee=a(),m(g.$$.fragment),le=a(),m(b.$$.fragment),te=a(),j=i("p"),j.innerHTML=xe,se=a(),f=i("p"),f.textContent=Qe,ae=a(),m(C.$$.fragment),ne=a(),h=i("div"),h.innerHTML=He,ie=a(),I=i("p"),I.innerHTML=Ye,oe=a(),k=i("ul"),k.innerHTML=Fe,pe=a(),m(B.$$.fragment),re=a(),v=i("p"),v.textContent=_e,ce=a(),c=i("iframe"),Me=a(),m(G.$$.fragment),me=a(),$=i("p"),$.innerHTML=Le,ue=a(),m(R.$$.fragment),ye=a(),S=i("p"),S.innerHTML=Ee,de=a(),W=i("p"),W.innerHTML=Ne,Je=a(),m(Z.$$.fragment),Te=a(),x=i("p"),x.textContent=Ve,Ue=a(),Q=i("p"),Q.innerHTML=qe,he=a(),m(H.$$.fragment),we=a(),m(Y.$$.fragment),ge=a(),F=i("p"),F.innerHTML=Xe,be=a(),_=i("p"),_.innerHTML=Ae,je=a(),m(z.$$.fragment),fe=a(),L=i("p"),L.innerHTML=De,Ce=a(),m(E.$$.fragment),Ie=a(),M=i("iframe"),ke=a(),N=i("p"),N.innerHTML=Pe,Be=a(),V=i("p"),V.innerHTML=Oe,ve=a(),q=i("p"),q.textContent=el,Ge=a(),m(X.$$.fragment),$e=a(),D=i("p"),this.h()},l(e){const l=ol("svelte-u9bgzb",document.head);U=o(l,"META",{name:!0,content:!0}),l.forEach(t),P=n(e),A=o(e,"P",{}),Se(A).forEach(t),O=n(e),u(w.$$.fragment,e),ee=n(e),u(g.$$.fragment,e),le=n(e),u(b.$$.fragment,e),te=n(e),j=o(e,"P",{"data-svelte-h":!0}),p(j)!=="svelte-1ucl3jt"&&(j.innerHTML=xe),se=n(e),f=o(e,"P",{"data-svelte-h":!0}),p(f)!=="svelte-rkaxdn"&&(f.textContent=Qe),ae=n(e),u(C.$$.fragment,e),ne=n(e),h=o(e,"DIV",{class:!0,"data-svelte-h":!0}),p(h)!=="svelte-nclpfp"&&(h.innerHTML=He),ie=n(e),I=o(e,"P",{"data-svelte-h":!0}),p(I)!=="svelte-11847dt"&&(I.innerHTML=Ye),oe=n(e),k=o(e,"UL",{"data-svelte-h":!0}),p(k)!=="svelte-zka2tb"&&(k.innerHTML=Fe),pe=n(e),u(B.$$.fragment,e),re=n(e),v=o(e,"P",{"data-svelte-h":!0}),p(v)!=="svelte-xtup6g"&&(v.textContent=_e),ce=n(e),c=o(e,"IFRAME",{src:!0,frameborder:!0,height:!0,title:!0,class:!0,allow:!0,sandbox:!0}),Se(c).forEach(t),Me=n(e),u(G.$$.fragment,e),me=n(e),$=o(e,"P",{"data-svelte-h":!0}),p($)!=="svelte-6unewf"&&($.innerHTML=Le),ue=n(e),u(R.$$.fragment,e),ye=n(e),S=o(e,"P",{"data-svelte-h":!0}),p(S)!=="svelte-18221ng"&&(S.innerHTML=Ee),de=n(e),W=o(e,"P",{"data-svelte-h":!0}),p(W)!=="svelte-1k8f2bl"&&(W.innerHTML=Ne),Je=n(e),u(Z.$$.fragment,e),Te=n(e),x=o(e,"P",{"data-svelte-h":!0}),p(x)!=="svelte-ueix3a"&&(x.textContent=Ve),Ue=n(e),Q=o(e,"P",{"data-svelte-h":!0}),p(Q)!=="svelte-1wvduip"&&(Q.innerHTML=qe),he=n(e),u(H.$$.fragment,e),we=n(e),u(Y.$$.fragment,e),ge=n(e),F=o(e,"P",{"data-svelte-h":!0}),p(F)!=="svelte-wlu6wo"&&(F.innerHTML=Xe),be=n(e),_=o(e,"P",{"data-svelte-h":!0}),p(_)!=="svelte-1fib0dd"&&(_.innerHTML=Ae),je=n(e),u(z.$$.fragment,e),fe=n(e),L=o(e,"P",{"data-svelte-h":!0}),p(L)!=="svelte-1igc5vi"&&(L.innerHTML=De),Ce=n(e),u(E.$$.fragment,e),Ie=n(e),M=o(e,"IFRAME",{src:!0,frameborder:!0,height:!0,title:!0,class:!0,allow:!0,sandbox:!0}),Se(M).forEach(t),ke=n(e),N=o(e,"P",{"data-svelte-h":!0}),p(N)!=="svelte-qdsi6r"&&(N.innerHTML=Pe),Be=n(e),V=o(e,"P",{"data-svelte-h":!0}),p(V)!=="svelte-6e2nmj"&&(V.innerHTML=Oe),ve=n(e),q=o(e,"P",{"data-svelte-h":!0}),p(q)!=="svelte-9epx9p"&&(q.textContent=el),Ge=n(e),u(X.$$.fragment,e),$e=n(e),D=o(e,"P",{}),Se(D).forEach(t),this.h()},h(){r(U,"name","hf:doc:metadata"),r(U,"content",yl),r(h,"class","flex justify-center"),ll(c.src,ze="https://course-demos-Rick-and-Morty-QA.hf.space")||r(c,"src",ze),r(c,"frameborder","0"),r(c,"height","800"),r(c,"title","Gradio app"),r(c,"class","container p-0 flex-grow space-iframe"),r(c,"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"),r(c,"sandbox","allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-downloads"),ll(M.src,Ke="https://course-demos-Sketch-Recognition.hf.space")||r(M,"src",Ke),r(M,"frameborder","0"),r(M,"height","650"),r(M,"title","Gradio app"),r(M,"class","container p-0 flex-grow space-iframe"),r(M,"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"),r(M,"sandbox","allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts allow-downloads")},m(e,l){pl(document.head,U),s(e,P,l),s(e,A,l),s(e,O,l),y(w,e,l),s(e,ee,l),y(g,e,l),s(e,le,l),y(b,e,l),s(e,te,l),s(e,j,l),s(e,se,l),s(e,f,l),s(e,ae,l),y(C,e,l),s(e,ne,l),s(e,h,l),s(e,ie,l),s(e,I,l),s(e,oe,l),s(e,k,l),s(e,pe,l),y(B,e,l),s(e,re,l),s(e,v,l),s(e,ce,l),s(e,c,l),s(e,Me,l),y(G,e,l),s(e,me,l),s(e,$,l),s(e,ue,l),y(R,e,l),s(e,ye,l),s(e,S,l),s(e,de,l),s(e,W,l),s(e,Je,l),y(Z,e,l),s(e,Te,l),s(e,x,l),s(e,Ue,l),s(e,Q,l),s(e,he,l),y(H,e,l),s(e,we,l),y(Y,e,l),s(e,ge,l),s(e,F,l),s(e,be,l),s(e,_,l),s(e,je,l),y(z,e,l),s(e,fe,l),s(e,L,l),s(e,Ce,l),y(E,e,l),s(e,Ie,l),s(e,M,l),s(e,ke,l),s(e,N,l),s(e,Be,l),s(e,V,l),s(e,ve,l),s(e,q,l),s(e,Ge,l),y(X,e,l),s(e,$e,l),s(e,D,l),Re=!0},p:sl,i(e){Re||(d(w.$$.fragment,e),d(g.$$.fragment,e),d(b.$$.fragment,e),d(C.$$.fragment,e),d(B.$$.fragment,e),d(G.$$.fragment,e),d(R.$$.fragment,e),d(Z.$$.fragment,e),d(H.$$.fragment,e),d(Y.$$.fragment,e),d(z.$$.fragment,e),d(E.$$.fragment,e),d(X.$$.fragment,e),Re=!0)},o(e){J(w.$$.fragment,e),J(g.$$.fragment,e),J(b.$$.fragment,e),J(C.$$.fragment,e),J(B.$$.fragment,e),J(G.$$.fragment,e),J(R.$$.fragment,e),J(Z.$$.fragment,e),J(H.$$.fragment,e),J(Y.$$.fragment,e),J(z.$$.fragment,e),J(E.$$.fragment,e),J(X.$$.fragment,e),Re=!1},d(e){e&&(t(P),t(A),t(O),t(ee),t(le),t(te),t(j),t(se),t(f),t(ae),t(ne),t(h),t(ie),t(I),t(oe),t(k),t(pe),t(re),t(v),t(ce),t(c),t(Me),t(me),t($),t(ue),t(ye),t(S),t(de),t(W),t(Je),t(Te),t(x),t(Ue),t(Q),t(he),t(we),t(ge),t(F),t(be),t(_),t(je),t(fe),t(L),t(Ce),t(Ie),t(M),t(ke),t(N),t(Be),t(V),t(ve),t(q),t(Ge),t($e),t(D)),t(U),T(w,e),T(g,e),T(b,e),T(C,e),T(B,e),T(G,e),T(R,e),T(Z,e),T(H,e),T(Y,e),T(z,e),T(E,e),T(X,e)}}}const yl='{"title":"Делимся демо с другими","local":"sharing-demos-with-others","sections":[{"title":"Доработка демо Gradio:","local":"polishing-your-gradio-demo","sections":[],"depth":3},{"title":"Распространение демо с помощью временных ссылок","local":"sharing-your-demo-with-temporary-links","sections":[],"depth":3},{"title":"Хостинг вашего демо на Hugging Face Spaces","local":"hosting-your-demo-on-hugging-face-spaces","sections":[],"depth":3},{"title":"✏️ Давайте применим это!","local":"lets-apply-it","sections":[],"depth":2}],"depth":1}';function dl(Ze){return al(()=>{new URLSearchParams(window.location.search).get("fw")}),[]}class bl extends nl{constructor(U){super(),il(this,U,dl,ul,tl,{})}}export{bl as component};