1import { p as prop, e as init, i as if_block, d as bind_this, f as set_style, b as set_class, k as each, u as index } from './i18n-CMo5lpzy.js'; 2import { R as push, aa as onMount, a1 as legacy_pre_effect, G as deep_read_state, M as tick, w as get, a2 as legacy_pre_effect_reset, t as template_effect, z as untrack, Z as event, a as append, T as pop, a3 as mutable_source, x as set, U as flushSync, V as child, X as sibling, W as from_html, Y as reset, a6 as comment, S as first_child, ak as remove_textarea_child, a0 as set_text, a7 as text } from './index-BvBk1Iap.js'; 3import { b as bind_value } from './input-C317uaXR.js'; 4import './StreamingBar.svelte_svelte_type_style_lang-CdFIGsJa.js'; 5import './ScrollFade.svelte_svelte_type_style_lang-Xm-PLg9E.js'; 6import { C as Code } from './Code-C9UfsaaR.js'; 7/* empty css */ 8import { M as Markdown } from './Index.svelte_svelte_type_style_lang-BiKot9ba.js'; 9import './MarkdownCode-Cg7CjFvQ.js'; 10import './index-C7e-J7CF.js'; 11/* empty css */ 12import './html-CdUEtR5E.js'; 13import './snippet-Bl5YVoCg.js'; 14import './actions-Cit_UA5S.js'; 15import './utils.svelte-CYLB_jIA.js'; 16import './clone-DaB-S2nH.js'; 17import './Check-BlnBgjLT.js'; 18import './Copy-DFFray7x.js'; 19import './IconButtonWrapper-Ba0GidgU.js'; 20import './prism-python-CbXMXbdR.js'; 21 22var root_3 = from_html(`<span class="added svelte-1s2fnws"> </span>`); 23var root_4 = from_html(`<span class="removed svelte-1s2fnws"> </span>`); 24var root_2 = from_html(`<span class="diff-stats svelte-1s2fnws"><!> <!></span>`); 25var root_7 = from_html(`<button class="undo-button svelte-1s2fnws" title="Undo this change">Undo</button>`); 26var root_6 = from_html(`<div><div class="message-content svelte-1s2fnws"><span class="message-text svelte-1s2fnws"><!></span> <!></div></div>`); 27var root_8 = from_html(`<div class="no-messages svelte-1s2fnws">No messages yet</div>`); 28var root_10 = from_html(`<button class="starter-query-button svelte-1s2fnws"> </button>`); 29var root_9 = from_html(`<div class="starter-queries-container svelte-1s2fnws"><div class="starter-queries svelte-1s2fnws"></div></div>`); 30var root_5 = from_html(`<div class="message-history svelte-1s2fnws"><!> <!> <!></div>`); 31var root_12 = from_html(`<div class="code-content svelte-1s2fnws"><div class="code-editor-container svelte-1s2fnws"><!></div> <button><!></button> <button class="deploy-to-spaces-button svelte-1s2fnws"><span class="button-content svelte-1s2fnws">Deploy to <svg class="spaces-logo svelte-1s2fnws" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false" role="img" preserveAspectRatio="xMidYMid meet" viewBox="0 0 39 40"><path d="M6.3712 2.04427C3.7183 2.04427 1.56771 4.19486 1.56771 6.84776V18.3546V18.6544V32.7341C1.56771 35.3868 3.71818 37.5377 6.3712 37.5377H17.878H20.7507H32.2575C34.9104 37.5377 37.0612 35.387 37.0612 32.7341V21.6204C37.0612 20.177 36.4252 18.8839 35.4189 18.004C36.4576 16.3895 37.0612 14.4666 37.0612 12.4046C37.0612 6.68274 32.4225 2.04427 26.7007 2.04427C24.6388 2.04427 22.7159 2.64776 21.1014 3.68647C20.2214 2.6802 18.9282 2.04427 17.4849 2.04427H6.3712Z" fill="black" class="stroke-white dark:stroke-white/10" stroke-width="3.07552"></path><path d="M9.56855 23.5001C8.8406 23.5001 8.25047 24.0902 8.25047 24.8182V29.5361C8.25047 30.2641 8.8406 30.8542 9.56855 30.8542H14.2864C15.0144 30.8542 15.6045 30.2641 15.6045 29.5361V24.8182C15.6045 24.0902 15.0143 23.5001 14.2864 23.5001H9.56855Z" fill="#FF3270"></path><path d="M24.3409 23.5001C23.613 23.5001 23.0228 24.0902 23.0228 24.8182V29.5361C23.0228 30.2641 23.613 30.8542 24.3409 30.8542H29.0588C29.7868 30.8542 30.3769 30.2641 30.3769 29.5361V24.8182C30.3769 24.0902 29.7868 23.5001 29.0588 23.5001H24.3409Z" fill="#861FFF"></path><path d="M9.56855 8.72815C8.8406 8.72815 8.25047 9.31827 8.25047 10.0462V14.7641C8.25047 15.4921 8.8406 16.0822 9.56855 16.0822H14.2864C15.0144 16.0822 15.6045 15.4921 15.6045 14.7641V10.0462C15.6045 9.31827 15.0143 8.72815 14.2864 8.72815H9.56855Z" fill="#097EFF"></path><path d="M26.6999 8.72815C24.6692 8.72815 23.0228 10.3744 23.0228 12.4052C23.0228 14.4359 24.6692 16.0822 26.6999 16.0822C28.7306 16.0822 30.3769 14.4359 30.3769 12.4052C30.3769 10.3744 28.7306 8.72815 26.6999 8.72815Z" fill="#FFD702"></path></svg> <span style="font-weight: 600;">Spaces</span></span></button></div>`); 32var root_1 = from_html(`<div class="vibe-editor svelte-1s2fnws"><button class="resize-handle svelte-1s2fnws" aria-label="Resize sidebar"></button> <div class="tab-header svelte-1s2fnws"><button>
32Chat</button> <button>Code <!></button></div> <div class="tab-content svelte-1s2fnws"><!></div> <div class="input-section svelte-1s2fnws"><div class="powered-by svelte-1s2fnws">Powered by: <code>gpt-oss</code></div> <textarea placeholder="What can I add or change?" class="prompt-input svelte-1s2fnws"></textarea> <button class="submit-button svelte-1s2fnws">Send</button></div></div>`); 33 34function Index($$anchor, $$props) { 35 push($$props, false); 36 37 let app = prop($$props, 'app', 12); 38 let root = prop($$props, 'root', 12); 39 let prompt = mutable_source(""); 40 let editorWidth = mutable_source(350); 41 let isResizing = false; 42 let editorElement = mutable_source(); 43 let activeTab = mutable_source("chat"); 44 let codeValue = mutable_source(""); 45 let diffStats = mutable_source(null); 46 let message_history = mutable_source([]); 47 let history_elem = mutable_source(); 48 49 const scroll_to_bottom = (behavior = "smooth") => { 50 if (!get(history_elem)) return; 51 52 get(history_elem).scrollTo({ top: get(history_elem).scrollHeight, behavior }); 53 }; 54 55 let starterQueries = mutable_source([]); 56 57 const fetchStarterQueries = async () => { 58 const post = app().post_data(`${root()}/gradio_api/vibe-starter-queries/`, {}); 59 60 post.then(async ([response, status_code]) => { 61 if (status_code !== 200) { 62 throw new Error(`Error: ${status_code}`); 63 } 64 65 const responseData = response; 66 67 set(starterQueries, responseData.starter_queries); 68 }).catch(async (error) => { 69 console.error("Failed to fetch starter queries:", error); 70 }); 71 }; 72 73 fetchStarterQueries(); 74 75 const submit = async (queryText) => { 76 const textToSubmit = queryText || get(prompt); 77 78 if (textToSubmit.trim() === "") return; 79 80 // Clear diff stats when submitting new prompt 81 set(diffStats, null); 82 83 const userMessageIndex = get(message_history).length; 84 85 set(message_history, [ 86 ...get(message_history), 87 { text: textToSubmit, isBot: false } 88 ]); 89 90 const botMessageIndex = get(message_history).length; 91 92 set(message_history, [ 93 ...get(message_history), 94 { text: "Working...", isBot: true, isPending: true } 95 ]); 96 97 await tick(); 98 scroll_to_bottom(); 99 100 const userPrompt = textToSubmit; 101 102 if (!queryText) { 103 set(prompt, ""); 104 } 105 106 const post = app().post_data(`${root()}/gradio_api/vibe-edit/`, { prompt: userPrompt }); 107 108 post.then(async ([response, status_code]) => { 109 if (status_code !== 200) { 110 throw new Error(`Error: ${status_code}`); 111 } 112 113 const responseData = response; 114 115 // Update diff stats from response 116 set(diffStats, responseData.diff_stats); 117 118 set(message_history, get(message_history).map((msg, index) => { 119 return index === userMessageIndex ? { ...msg, hash: responseData.hash } : msg; 120 })); 121 122 set(message_history, get(message_history).map((msg, index) => index === botMessageIndex 123 ? { 124 text: responseData.reasoning ? responseData.reasoning : "Done.", 125 isBot: true, 126 isPending: false 127 } 128 : msg)); 129 130 await tick(); 131 scroll_to_bottom(); 132 }).catch(async (error) => { 133 set(message_history, get(message_history).map((msg, index) => index === botMessageIndex 134 ? { text: "Error occurred.", isBot: true, isPending: false } 135 : msg)); 136 137 await tick(); 138 scroll_to_bottom(); 139 }); 140 }; 141 142 const handleStarterQuery = async (query) => { 143 await submit(query); 144 }; 145 146 const undoMessage = async (hash, messageIndex) => { 147 try { 148 await app().post_data(`${root()}/gradio_api/undo-vibe-edit/`, { hash }); 149 150 // Clear diff stats when undoing 151 set(diffStats, null); 152 153 const messageToUndo = get(message_history)[messageIndex]; 154 155 set(prompt, messageToUndo.text); 156 set(message_history, get(message_history).slice(0, messageIndex)); 157 } catch(error) { 158 console.error("Failed to undo:", error); 159 } 160 }; 161 162 const handleResizeStart = (e) => { 163 e.preventDefault(); 164 isResizing = true; 165 document.addEventListener("mousemove", handleResizeMove); 166 document.addEventListener("mouseup", handleResizeEnd); 167 document.body.style.cursor = "col-resize"; 168 document.body.style.userSelect = "none"; 169 }; 170 171 const handleResizeMove = (e) => { 172 if (!isResizing) return; 173 174 const minWidth = 250; 175 const maxWidth = Math.min(800, window.innerWidth * 0.5); 176 const newWidth = window.innerWidth - e.clientX; 177 178 set(editorWidth, Math.max(minWidth, Math.min(maxWidth, newWidth))); 179 180 // Dispatch custom event to update the main content margin 181 window.dispatchEvent(new CustomEvent("vibeEditorResize", { detail: { width: get(editorWidth) } })); 182 }; 183 184 const handleResizeEnd = () => { 185 isResizing = false;
186 document.removeEventListener("mousemove", handleResizeMove); 187 document.removeEventListener("mouseup", handleResizeEnd); 188 document.body.style.cursor = ""; 189 document.body.style.userSelect = ""; 190 }; 191 192 const fetchCode = async () => { 193 try { 194 const response = await fetch(`${root()}/gradio_api/vibe-code/`, { 195 method: "GET", 196 headers: { "Content-Type": "application/json" } 197 }); 198 199 if (response.ok) { 200 const data = await response.json(); 201 202 set(codeValue, data.code); 203 } 204 } catch(error) { 205 console.error("Failed to fetch code:", error); 206 } 207 }; 208 209 let code_updated = mutable_source(false); 210 211 const updateCode = async () => { 212 try { 213 await app().post_data(`${root()}/gradio_api/vibe-code/`, { code: get(codeValue) }); 214 set(code_updated, true); 215 216 setTimeout( 217 () => { 218 set(code_updated, false); 219 }, 220 1000 221 ); 222 } catch(error) { 223 console.error("Failed to update code:", error); 224 } 225 }; 226 227 function create_spaces_url() { 228 const base_URL = "https://huggingface.co/new-space"; 229 const params = new URLSearchParams({ name: "new-space", sdk: "gradio" }); 230 const encoded_content = get(codeValue).trimStart(); 231 232 params.append("files[0][path]", "app.py"); 233 params.append("files[0][content]", encoded_content); 234 window.open(`${base_URL}?${params.toString()}`, "_blank")?.focus(); 235 } 236 237 onMount(() => { 238 return () => { 239 document.removeEventListener("mousemove", handleResizeMove); 240 document.removeEventListener("mouseup", handleResizeEnd); 241 }; 242 }); 243 244 legacy_pre_effect(() => (deep_read_state(app())), () => { 245 (app(), fetchCode()); 246 }); 247 248 legacy_pre_effect(() => (get(activeTab), tick), () => { 249 if (get(activeTab) === "chat") { 250 tick().then(() => scroll_to_bottom("auto")); 251 } 252 }); 253 254 legacy_pre_effect(() => (get(code_updated)), () => { 255 get(code_updated); 256 }); 257 258 legacy_pre_effect(() => (get(starterQueries)), () => { 259 get(starterQueries); 260 }); 261 262 legacy_pre_effect_reset(); 263 264 var $$exports = { 265 get app() { 266 return app(); 267 }, 268 269 set app($$value) { 270 app($$value); 271 flushSync(); 272 }, 273 274 get root() { 275 return root(); 276 }, 277 278 set root($$value) { 279 root($$value); 280 flushSync(); 281 } 282 }; 283 284 init(); 285 286 var div = root_1(); 287 var button = child(div); 288 var div_1 = sibling(button, 2); 289 var button_1 = child(div_1); 290 let classes; 291 var button_2 = sibling(button_1, 2); 292 let classes_1; 293 var node = sibling(child(button_2)); 294 295 { 296 var consequent_2 = ($$anchor) => { 297 var span = root_2(); 298 var node_1 = child(span); 299 300 { 301 var consequent = ($$anchor) => { 302 var span_1 = root_3(); 303 var text = child(span_1); 304 305 reset(span_1); 306 307 template_effect(() => set_text(text, `+${( 308 get(diffStats), 309 untrack(() => get(diffStats).lines_added) 310 ) ?? ''}`)); 311 312 append($$anchor, span_1); 313 }; 314 315 if_block(node_1, ($$render) => { 316 if (( 317 get(diffStats), 318 untrack(() => get(diffStats).lines_added > 0) 319 )) $$render(consequent); 320 }); 321 } 322 323 var node_2 = sibling(node_1, 2); 324 325 { 326 var consequent_1 = ($$anchor) => { 327 var span_2 = root_4(); 328 var text_1 = child(span_2); 329 330 reset(span_2); 331 332 template_effect(() => set_text(text_1, `-${( 333 get(diffStats), 334 untrack(() => get(diffStats).lines_removed) 335 ) ?? ''}`)); 336 337 append($$anchor, span_2); 338 }; 339 340 if_block(node_2, ($$render) => { 341 if (( 342 get(diffStats), 343 untrack(() => get(diffStats).lines_removed > 0) 344 )) $$render(consequent_1); 345 }); 346 } 347 348 reset(span); 349 append($$anchor, span); 350 }; 351 352 if_block(node, ($$render) => { 353 if (( 354 get(diffStats), 355 untrack(() => get(diffStats) && (get(diffStats).lines_added > 0 || get(diffStats).lines_removed > 0)) 356 )) $$render(consequent_2); 357 }); 358 } 359 360 reset(button_2); 361 reset(div_1); 362 363 var div_2 = sibling(div_1, 2); 364 var node_3 = child(div_2); 365 366 { 367 var consequent_6 = ($$anchor) => { 368 var div_3 = root_5(); 369 var node_4 = child(div_3); 370 371 each(node_4, 1, () => get(message_history), index, ($$anchor, message, index) => { 372 var div_4 = root_6(); 373 let classes_2; 374 var div_5 = child(div_4); 375 var span_3 = child(div_5); 376 var node_5 = child(span_3); 377 378 Markdown(node_5, { 379 get value() { 380 return (get(message), untrack(() => get(message).text)); 381 }, 382 latex_delimiters: [],
383 theme_mode: 'system' 384 }); 385 386 reset(span_3); 387 388 var node_6 = sibling(span_3, 2); 389 390 { 391 var consequent_3 = ($$anchor) => { 392 var button_3 = root_7(); 393 394 event('click', button_3, () => undoMessage(get(message).hash || "", index)); 395 append($$anchor, button_3); 396 }; 397 398 if_block(node_6, ($$render) => { 399 if (( 400 get(message), 401 untrack(() => !get(message).isBot && get(message).hash && !get(message).isPending) 402 )) $$render(consequent_3); 403 }); 404 } 405 406 reset(div_5); 407 reset(div_4); 408 409 template_effect(() => classes_2 = set_class(div_4, 1, 'message-item svelte-1s2fnws', null, classes_2, { 410 'bot-message': get(message).isBot, 411 'user-message': !get(message).isBot 412 })); 413 414 append($$anchor, div_4); 415 }); 416 417 var node_7 = sibling(node_4, 2); 418 419 { 420 var consequent_4 = ($$anchor) => { 421 var div_6 = root_8(); 422 423 append($$anchor, div_6); 424 }; 425 426 if_block(node_7, ($$render) => { 427 if (( 428 get(message_history), 429 untrack(() => get(message_history).length === 0) 430 )) $$render(consequent_4); 431 }); 432 } 433 434 var node_8 = sibling(node_7, 2); 435 436 { 437 var consequent_5 = ($$anchor) => { 438 var div_7 = root_9(); 439 var div_8 = child(div_7); 440 441 each(div_8, 5, () => get(starterQueries), index, ($$anchor, query) => { 442 var button_4 = root_10(); 443 var text_2 = child(button_4, true); 444 445 reset(button_4); 446 template_effect(() => set_text(text_2, get(query))); 447 event('click', button_4, () => handleStarterQuery(get(query))); 448 append($$anchor, button_4); 449 }); 450 451 reset(div_8); 452 reset(div_7); 453 append($$anchor, div_7); 454 }; 455 456 if_block(node_8, ($$render) => { 457 if (( 458 get(message_history), 459 untrack(() => get(message_history).length === 0) 460 )) $$render(consequent_5); 461 }); 462 } 463 464 reset(div_3); 465 bind_this(div_3, ($$value) => set(history_elem, $$value), () => get(history_elem)); 466 append($$anchor, div_3); 467 }; 468 469 var alternate_1 = ($$anchor) => { 470 var fragment = comment(); 471 var node_9 = first_child(fragment); 472 473 { 474 var consequent_8 = ($$anchor) => { 475 var div_9 = root_12(); 476 var div_10 = child(div_9);
477 var node_10 = child(div_10); 478 479 Code(node_10, { 480 language: 'python', 481 lines: 10, 482 dark_mode: false, 483 basic: true, 484 readonly: false, 485 placeholder: 'Enter your code here...', 486 wrap_lines: true, 487 get value() { 488 return get(codeValue); 489 }, 490 491 set value($$value) { 492 set(codeValue, $$value); 493 }, 494 $$legacy: true 495 }); 496 497 reset(div_10); 498 499 var button_5 = sibling(div_10, 2); 500 let classes_3; 501 var node_11 = child(button_5); 502 503 { 504 var consequent_7 = ($$anchor) => { 505 var text_3 = text('Updated!'); 506 507 append($$anchor, text_3); 508 }; 509 510 var alternate = ($$anchor) => { 511 var text_4 = text('Update Code'); 512 513 append($$anchor, text_4); 514 }; 515 516 if_block(node_11, ($$render) => { 517 if (get(code_updated)) $$render(consequent_7); else $$render(alternate, false); 518 }); 519 } 520 521 reset(button_5); 522 523 var button_6 = sibling(button_5, 2); 524 525 reset(div_9); 526 template_effect(() => classes_3 = set_class(button_5, 1, 'update-code-button svelte-1s2fnws', null, classes_3, { updating: get(code_updated) })); 527 event('click', button_5, updateCode); 528 event('click', button_6, () => create_spaces_url()); 529 append($$anchor, div_9); 530 }; 531 532 if_block( 533 node_9, 534 ($$render) => { 535 if (get(activeTab) === "code") $$render(consequent_8); 536 }, 537 true 538 ); 539 } 540 541 append($$anchor, fragment); 542 }; 543 544 if_block(node_3, ($$render) => { 545 if (get(activeTab) === "chat") $$render(consequent_6); else $$render(alternate_1, false); 546 }); 547 } 548 549 reset(div_2); 550 551 var div_11 = sibling(div_2, 2); 552 var textarea = sibling(child(div_11), 2); 553 554 remove_textarea_child(textarea); 555 556 var button_7 = sibling(textarea, 2); 557 558 reset(div_11); 559 reset(div); 560 bind_this(div, ($$value) => set(editorElement, $$value), () => get(editorElement)); 561 562 template_effect( 563 ($0) => { 564 set_style(div, `width: ${get(editorWidth) ?? ''}px;`); 565 classes = set_class(button_1, 1, 'tab-button svelte-1s2fnws', null, classes, { active: get(activeTab) === "chat" }); 566 classes_1 = set_class(button_2, 1, 'tab-button svelte-1s2fnws', null, classes_1, { active: get(activeTab) === "code" }); 567 button_7.disabled = $0; 568 }, 569 [ 570 () => (get(prompt), untrack(() => get(prompt).trim() === "")) 571 ] 572 ); 573 574 event('mousedown', button, handleResizeStart); 575 event('click', button_1, () => set(activeTab, "chat")); 576 event('click', button_2, () => set(activeTab, "code")); 577 578 event('keydown', textarea, (e) => { 579 if (e.key === "Enter" && !e.shiftKey) { 580 e.preventDefault(); 581 submit(); 582 } 583 }); 584 585 bind_value(textarea, () => get(prompt), ($$value) => set(prompt, $$value)); 586 event('click', button_7, () => submit()); 587 append($$anchor, div); 588 589 return pop($$exports); 590} 591 592export { Index as default }; 593//# sourceMappingURL=Index-DrpT8pjh.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.