1import { p as prop, e as init, a as set_attribute, i as if_block, b as set_class, k as each, d as bind_this, f as set_style, u as index, r as rest_props, g as spread_props } from './i18n-dpAHICcw.js'; 2import { R as push, a4 as createEventDispatcher, V as child, X as sibling, Y as reset, t as template_effect, a0 as set_text, Z as event, a as append, T as pop, U as flushSync, W as from_html, u as state, v as proxy, y as user_effect, x as set, w as get, ab as onMount, a7 as text, ax as $window, a5 as user_derived, a6 as comment, S as first_child, a8 as next, al as remove_textarea_child, N as tick } from './index-CDZuCcOm.js'; 3import { G as Gradio } from './utils.svelte-CyWLYi-B.js'; 4import { t as transition, f as fade } from './StreamingBar.svelte_svelte_type_style_lang-BxBb9ZZb.js'; 5import { b as bind_value } from './input-UUW65DyE.js'; 6import { I as IconButton } from './ScrollFade.svelte_svelte_type_style_lang-DUvCSfRk.js'; 7import { B as BlockTitle } from './BlockTitle-Xgz-MKYS.js'; 8import './MarkdownCode.svelte_svelte_type_style_lang-GeNUGzep.js'; 9import { C as Check } from './Check-4kogBHUX.js'; 10import { C as Copy } from './Copy-C8W4pNlO.js'; 11import { P as Plus } from './Plus-CQgnmcGN.js'; 12import { S as Send } from './Send-DHvsoBjG.js'; 13import { T as Trash } from './Trash-DD3UIc2i.js'; 14import { I as IconButtonWrapper } from './IconButtonWrapper-KjCt2Pl8.js'; 15import { b as Dropdown, D as DropdownOptions } from './Dropdown-BusLCoow.js'; 16/* empty css */ 17import { B as Block } from './Block-DntE23uJ.js'; 18import { S as Static } from './index-DyDpuTN9.js'; 19export { default as BaseExample } from './Example-CgYbjWRT.js'; 20import './clone-dZfS06Ds.js'; 21import './html-h_YSgefI.js'; 22import './snippet-DVkMfmSq.js'; 23import './Info-CLoErKII.js'; 24import './MarkdownCode-Q694H4-C.js'; 25import './prism-python-C_fanlsZ.js'; 26import './window-DwfrWsjF.js'; 27import './DropdownArrow-BRSpwupS.js'; 28import './Clear-tvJMRS4J.js'; 29 30var root$1 = from_html(`<div class="s s--slider svelte-1io85vl" style="font-size:var(--font-size-sm)px"><button role="switch" class="svelte-1io85vl"></button> <span> </span></div>`); 31 32function Switch($$anchor, $$props) { 33 push($$props, false); 34 35 // based on https://svelte.dev/playground/d65a4e9f0ae74d1eb1b08d13e428af32?version=3.35.0 36 let label = prop($$props, 'label', 12); 37 38 let checked = prop($$props, 'checked', 12, false); 39 let disabled = prop($$props, 'disabled', 12, false); 40 const dispatch = createEventDispatcher(); 41 42 // @ts-ignore 43 function handleClick(event) { 44 const target = event.target; 45 46 // @ts-ignore 47 const state = target.getAttribute("aria-checked"); 48 49 checked(state === "true" ? false : true); 50 dispatch("click", { checked: checked() }); 51 } 52 53 var $$exports = { 54 get label() { 55 return label(); 56 }, 57 58 set label($$value) { 59 label($$value); 60 flushSync(); 61 }, 62 63 get checked() { 64 return checked(); 65 }, 66 67 set checked($$value) { 68 checked($$value); 69 flushSync(); 70 }, 71 72 get disabled() { 73 return disabled(); 74 }, 75 76 set disabled($$value) { 77 disabled($$value); 78 flushSync(); 79 } 80 }; 81 82 init(); 83 84 var div = root$1(); 85 var button = child(div); 86 var span = sibling(button, 2); 87 var text = child(span, true); 88 89 reset(span); 90 reset(div); 91 92 template_effect(() => { 93 set_attribute(button, 'aria-checked', checked()); 94 button.disabled = disabled(); 95 set_text(text, label()); 96 }); 97 98 event('click', button, handleClick); 99 append($$anchor, div); 100 101 return pop($$exports); 102} 103 104var root_5 = from_html(`<div><!></div>`); 105var root_7 = from_html(`<div class="loading-overlay svelte-1p54cvv"><div class="loading-spinner svelte-1p54cvv"></div> <div class="loading-text svelte-1p54cvv">Converting to dialogue format...</div></div>`); 106var root_9 = from_html(`<textarea rows="1" readonly="" class="svelte-1p54cvv"></textarea>`); 107var root_11 = from_html(`<div id="tag-menu" class="tag-menu svelte-1p54cvv"><!></div>`); 108var root_12 = from_html(`<div><button class="add-button svelte-1p54cvv" aria-label="Add new line"><!></button></div>`); 109var root_8 = from_html(`<div class="dialogue-line svelte-1p54cvv"><div class="speaker-column svelte-1p54cvv" role="button" tabindex="0"><!></div> <div class="text-column svelte-1p54cvv"><div class="input-container svelte-1p54cvv"><textarea rows="1" class="svelte-1p54cvv"></textarea> <!></div></div> <!> <div><button class="delete-button svelte-1p54cvv" aria-label="Remove current line"><!></button></div></div>`); 110var root_6 = from_html(`<div><!> <!></div>`);
111var root_15 = from_html(`<div class="loading-overlay svelte-1p54cvv"><div class="loading-spinner svelte-1p54cvv"></div> <div class="loading-text svelte-1p54cvv">Converting to plain text...</div></div>`); 112var root_16 = from_html(`<div id="tag-menu" class="tag-menu-plain-text svelte-1p54cvv"><!></div>`); 113var root_14 = from_html(`<div><!> <textarea data-testid="textbox" class="svelte-1p54cvv"></textarea> <!></div>`); 114var root_17 = from_html(`<div class="submit-container svelte-1p54cvv"><button class="submit-button svelte-1p54cvv"><!></button></div>`); 115var root = from_html(`<div><!> <!> <!> <!> <!></div>`); 116 117function Dialogue($$anchor, $$props) { 118 push($$props, true); 119 const gradio = $$props.gradio; 120 let checked = state(false); 121 let disabled = user_derived(() => !gradio.shared.interactive); 122 let dialogue_lines = state(proxy([])); 123 124 user_effect(() => { 125 if (gradio.props.value && gradio.props.value.length && typeof gradio.props.value !== "string") { 126 set(dialogue_lines, [...gradio.props.value], true); 127 } else if (gradio.props.value && typeof gradio.props.value !== "string") { 128 set( 129 dialogue_lines, 130 [ 131 { 132 speaker: `${gradio.props.speakers.length ? gradio.props.speakers[0] : ""}`, 133 text: "" 134 } 135 ], 136 true 137 ); 138 } else if (typeof gradio.props.value === "string") { 139 set(textbox_value, gradio.props.value, true); 140 set(checked, true); 141 } 142 }); 143 144 let buttons = user_derived(() => gradio.props.buttons || ["copy"]); 145 146 let on_custom_button_click = (id) => { 147 gradio.dispatch("custom_button_click", { id }); 148 }; 149 150 let old_value = state(proxy(gradio.props.value)); 151 152 user_effect(() => { 153 if (get(old_value) != gradio.props.value) { 154 set(old_value, gradio.props.value, true); 155 gradio.dispatch("change"); 156 } 157 }); 158 159 let dialogue_container_element; 160 let showTagMenu = state(false); 161 let currentLineIndex = state(-1); 162 let selectedOptionIndex = state(0); 163 let filtered_tags = state(proxy([])); 164 let input_elements = proxy([]); 165 let textarea_element; 166 let offset_from_top = state(0); 167 let copied = state(false); 168 let timer; 169 let textbox_value = state(""); 170 let hoveredSpeaker = state(null); 171 let is_unformatting = state(false); 172 let is_formatting = state(false); 173 174 const defaultColorNames = [ 175 "red", 176 "green", 177 "blue", 178 "yellow", 179 "purple", 180 "teal", 181 "orange", 182 "cyan", 183 "lime", 184 "pink" 185 ]; 186 187 const colorNameToHex = { 188 red: "rgba(254, 202, 202, 0.7)", 189 green: "rgba(209, 250, 229, 0.7)", 190 blue: "rgba(219, 234, 254, 0.7)", 191 yellow: "rgba(254, 243, 199, 0.7)", 192 purple: "rgba(233, 213, 255, 0.7)", 193 teal: "rgba(204, 251, 241, 0.7)", 194 orange: "rgba(254, 215, 170, 0.7)", 195 cyan: "rgba(207, 250, 254, 0.7)", 196 lime: "rgba(217, 249, 157, 0.7)", 197 pink: "rgba(252, 231, 243, 0.7)" 198 }; 199 200 let speakerColors = user_derived(() => { 201 let _speakerColors = {}; 202 203 if (gradio.props.color_map) { 204 _speakerColors = { ...gradio.props.color_map }; 205 } else { 206 _speakerColors = {}; 207 208 gradio.props.speakers.forEach((speaker, index) => { 209 const colorName = defaultColorNames[index % defaultColorNames.length]; 210 211 _speakerColors[speaker] = colorNameToHex[colorName]; 212 }); 213 } 214 215 return _speakerColors; 216 }); 217 218 function add_line(index) { 219 const newSpeaker = gradio.props.speakers.length > 0 ? gradio.props.speakers[0] : ""; 220 221 set( 222 dialogue_lines, 223 [ 224 ...get(dialogue_lines).slice(0, index + 1), 225 { speaker: newSpeaker, text: "" }, 226 ...get(dialogue_lines).slice(index + 1) 227 ], 228 true 229 ); 230 231 tick().then(() => { 232 if (input_elements[index + 1]) { 233 input_elements[index + 1].focus(); 234 } 235 }); 236 237 gradio.props.value = [...get(dialogue_lines)]; 238 } 239 240 function delete_line(index) { 241 set( 242 dialogue_lines, 243 [ 244 ...get(dialogue_lines).slice(0, index), 245 ...get(dialogue_lines).slice(index + 1) 246 ], 247 true 248 ); 249 250 gradio.props.value = [...get(dialogue_lines)]; 251 } 252 253 function update_line(index, key, value) { 254 get(dialogue_lines)[index][key] = value; 255 set(dialogue_lines, [...get(dialogue_lines)], true); 256 gradio.props.value = [...get(dialogue_lines)]; 257 } 258 259 function handle_input(event, index) { 260 const input = event.target || HTMLTextAreaElement; 261 262 if (input && !input_elements[index]) { 263 input_elements[index] = input; 264 } 265 266 const cursor_position = input.selectionStart || 0; 267 const text = input.value; 268 let show_menu = false;
269 let position_reference_index = -1; 270 271 if (text[cursor_position - 1] === ":") { 272 set(currentLineIndex, index, true); 273 position_reference_index = cursor_position; 274 275 const search_text = get_tag_search_text(text, cursor_position); 276 277 set(filtered_tags, gradio.props.tags.filter((tag) => search_text === "" || tag.toLowerCase().includes(search_text.toLowerCase())), true); 278 show_menu = get(filtered_tags).length > 0; 279 set(selectedOptionIndex, 0); 280 } else { 281 const lastColonIndex = text.lastIndexOf(":", cursor_position - 1); 282 283 if (lastColonIndex >= 0 && !text.substring(lastColonIndex + 1, cursor_position).includes(" ")) { 284 set(currentLineIndex, index, true); 285 position_reference_index = lastColonIndex + 1; // Position menu relative to the start of the potential tag 286 287 const searchText = text.substring(lastColonIndex + 1, cursor_position); 288 289 set(filtered_tags, gradio.props.tags.filter((tag) => searchText === "" || tag.toLowerCase().includes(searchText.toLowerCase())), true); 290 show_menu = get(filtered_tags).length > 0; 291 set(selectedOptionIndex, 0); 292 } 293 } 294 295 if (show_menu && position_reference_index !== -1) { 296 set(showTagMenu, true); 297 298 const input_rect = input.getBoundingClientRect(); 299 300 // Position menu below the current input by calculating the distance from the top of the container 301 // and use 1.5 times the input height. 302 if (dialogue_container_element) { 303 const container_rect = dialogue_container_element.getBoundingClientRect(); 304 305 set(offset_from_top, container_rect.top + input_rect.height * (index + 1.5)); 306 } 307 } else { 308 set(showTagMenu, false); 309 } 310 311 gradio.dispatch("input"); 312 } 313 314 function get_tag_search_text(text, cursorPosition) { 315 const lastColonIndex = text.lastIndexOf(":", cursorPosition - 1); 316 317 if (lastColonIndex >= 0) { 318 return text.substring(lastColonIndex + 1, cursorPosition); 319 } 320 321 return ""; 322 } 323 324 async function insert_selected_tag() { 325 const tag = get(filtered_tags)[get(selectedOptionIndex)]; 326 327 if (tag) { 328 let text; 329 let currentInput; 330 331 if (get(checked)) { 332 currentInput = textarea_element; 333 text = get(textbox_value); 334 } else { 335 currentInput = input_elements[get(currentLineIndex)]; 336 text = get(dialogue_lines)[get(currentLineIndex)].text; 337 } 338 339 const cursorPosition = currentInput?.selectionStart || 0; 340 const lastColonIndex = text.lastIndexOf(":", cursorPosition - 1); 341 342 if (lastColonIndex >= 0) { 343 const beforeColon = text.substring(0, lastColonIndex); 344 const afterCursor = text.substring(cursorPosition); 345 346 if (get(checked)) { 347 // plain text mode: don't filter speaker tags 348 const newText = `${beforeColon}${tag} ${afterCursor}`; 349 350 set(textbox_value, newText); 351 352 if (gradio.props.speakers.length === 0) { 353 gradio.props.value = newText; 354 } else { 355 gradio.props.value = await gradio.shared.server.unformat({ text: newText }); 356 } 357 358 tick().then(() => { 359 if (textarea_element) { 360 const newCursorPosition = beforeColon.length + tag.length + 1; 361 362 textarea_element.setSelectionRange(newCursorPosition, newCursorPosition); 363 textarea_element.focus(); 364 } 365 }); 366 } else { 367 // dialogue line mode 368 const filteredBeforeColon = beforeColon.replace(/\[S\d+\]/g, "").trim(); 369 370 const newText = `${filteredBeforeColon}${tag} ${afterCursor}`; 371 372 update_line(get(currentLineIndex), "text", newText); 373 374 tick().then(() => { 375 const updatedInput = input_elements[get(currentLineIndex)]; 376 377 if (updatedInput) { 378 const newCursorPosition = filteredBeforeColon.length + tag.length + 1; 379 380 updatedInput.setSelectionRange(newCursorPosition, newCursorPosition); 381 updatedInput.focus(); 382 } 383 }); 384 } 385 } 386 387 set(showTagMenu, false); 388 set(selectedOptionIndex, 0); 389 } 390 } 391 392 async function insert_tag(index) { 393 index = parseInt(index); 394 395 const tag = gradio.props.tags[index]; 396 397 if (tag) { 398 let text; 399 let currentInput; 400 401 if (get(checked)) { 402 currentInput = textarea_element; 403 text = get(textbox_value); 404 } else { 405 currentInput = input_elements[get(currentLineIndex)]; 406 text = get(dialogue_lines)[get(currentLineIndex)].text; 407 } 408 409 const cursorPosition = currentInput?.selectionStart || 0; 410 const lastColonIndex = text.lastIndexOf(":", cursorPosition - 1); 411 412 if (lastColonIndex >= 0) { 413 const beforeColon = text.substring(0, lastColonIndex);
414 const afterCursor = text.substring(cursorPosition); 415 416 if (get(checked)) { 417 // plain text mode: don't filter speaker tags 418 const newText = `${beforeColon}${tag} ${afterCursor}`; 419 420 set(textbox_value, newText); 421 422 if (gradio.props.speakers.length === 0) { 423 gradio.props.value = newText; 424 } else { 425 gradio.props.value = await gradio.shared.server.unformat({ text: newText }); 426 } 427 428 tick().then(() => { 429 if (textarea_element) { 430 const newCursorPosition = beforeColon.length + tag.length + 1; 431 432 textarea_element.setSelectionRange(newCursorPosition, newCursorPosition); 433 textarea_element.focus(); 434 } 435 }); 436 } else { 437 // dialogue line mode 438 const filteredBeforeColon = beforeColon.replace(/\[S\d+\]/g, "").trim(); 439 440 const newText = `${filteredBeforeColon}${tag} ${afterCursor}`; 441 442 update_line(get(currentLineIndex), "text", newText); 443 444 tick().then(() => { 445 const updatedInput = input_elements[get(currentLineIndex)]; 446 447 if (updatedInput) { 448 const newCursorPosition = filteredBeforeColon.length + tag.length + 1; 449 450 updatedInput.setSelectionRange(newCursorPosition, newCursorPosition); 451 updatedInput.focus(); 452 } 453 }); 454 } 455 } 456 457 set(showTagMenu, false); 458 set(selectedOptionIndex, 0); 459 } 460 } 461 462 function handle_click_outside(event) { 463 if (get(showTagMenu)) { 464 const target = event.target; 465 const tagMenu = document.getElementById("tag-menu"); 466 467 if (tagMenu && !tagMenu.contains(target)) { 468 set(showTagMenu, false); 469 } 470 } 471 } 472 473 async function value_to_string(value) { 474 if (typeof value === "string") { 475 return value; 476 } 477 478 return await gradio.shared.server.format(value); 479 } 480 481 async function handle_copy() { 482 if ("clipboard" in navigator) { 483 const text = await value_to_string(gradio.props.value); 484 485 await navigator.clipboard.writeText(text); 486 copy_feedback(); 487 } 488 } 489 490 function copy_feedback() { 491 set(copied, true); 492 493 if (timer) clearTimeout(timer); 494 495 timer = setTimeout( 496 () => { 497 set(copied, false); 498 }, 499 1000 500 ); 501 } 502 503 async function handle_submit() { 504 if (get(checked)) { 505 gradio.props.value = await gradio.shared.server.unformat({ text: get(textbox_value) }); 506 } 507 508 gradio.dispatch("submit"); 509 } 510 511 onMount(async () => { 512 if (typeof gradio.props.value === "string") { 513 set(textbox_value, gradio.props.value, true); 514 } else if (gradio.props.value && gradio.props.value.length > 0) { 515 const formatted = await value_to_string(gradio.props.value); 516 517 set(textbox_value, formatted, true); 518 } else { 519 set(textbox_value, ""); 520 } 521 }); 522 523 var div = root(); 524 525 event('click', $window, handle_click_outside); 526 527 let classes; 528 var node = child(div); 529 530 { 531 var consequent_1 = ($$anchor) => { 532 IconButtonWrapper($$anchor, { 533 get buttons() { 534 return get(buttons); 535 }, 536 on_custom_button_click, 537 children: ($$anchor, $$slotProps) => { 538 var fragment_1 = comment();
539 var node_1 = first_child(fragment_1); 540 541 { 542 var consequent = ($$anchor) => { 543 { 544 let $0 = user_derived(() => get(copied) ? Check : Copy); 545 let $1 = user_derived(() => get(copied) ? "Copied" : "Copy"); 546 547 IconButton($$anchor, { 548 get Icon() { 549 return get($0); 550 }, 551 onclick: handle_copy, 552 get label() { 553 return get($1); 554 } 555 }); 556 } 557 }; 558 559 if_block(node_1, ($$render) => { 560 if (get(buttons).some((btn) => typeof btn === "string" && btn === "copy")) $$render(consequent); 561 }); 562 } 563 564 append($$anchor, fragment_1); 565 }, 566 $$slots: { default: true } 567 }); 568 }; 569 570 if_block(node, ($$render) => { 571 if (gradio.shared.show_label && (get(buttons).some((btn) => typeof btn === "string" && btn === "copy") || get(buttons).some((btn) => typeof btn !== "string"))) $$render(consequent_1); 572 }); 573 } 574 575 var node_2 = sibling(node, 2); 576 577 BlockTitle(node_2, { 578 get show_label() { 579 return gradio.shared.show_label; 580 }, 581 582 get info() { 583 return gradio.props.info; 584 }, 585 586 children: ($$anchor, $$slotProps) => { 587 next(); 588 589 var text_1 = text(); 590 591 template_effect(() => set_text(text_1, gradio.shared.label || "Dialogue")); 592 append($$anchor, text_1); 593 }, 594 $$slots: { default: true } 595 }); 596 597 var node_3 = sibling(node_2, 2); 598 599 { 600 var consequent_2 = ($$anchor) => { 601 var div_1 = root_5(); 602 let classes_1; 603 var node_4 = child(div_1); 604 605 { 606 let $0 = user_derived(() => get(is_formatting) || get(is_unformatting)); 607 608 Switch(node_4, { 609 label: 'Plain Text', 610 get disabled() { 611 return get($0); 612 }, 613 614 get checked() { 615 return get(checked); 616 }, 617 618 set checked($$value) { 619 set(checked, $$value, true); 620 }, 621 622 $$events: { 623 click: async (e) => { 624 if (!e.detail.checked) { 625 set(is_unformatting, true); 626 627 try { 628 gradio.props.value = await gradio.shared.server.unformat({ text: get(textbox_value) }); 629 set(dialogue_lines, [...gradio.props.value], true); 630 } finally { 631 set(is_unformatting, false); 632 } 633 } else { 634 set(is_formatting, true); 635 636 try { 637 set(textbox_value, await value_to_string(get(dialogue_lines)), true); 638 } finally { 639 set(is_formatting, false); 640 } 641 } 642 } 643 } 644 }); 645 } 646 647 reset(div_1); 648 649 template_effect(() => classes_1 = set_class(div_1, 1, 'switch-container top-switch svelte-1p54cvv', null, classes_1, { 650 'switch-disabled': get(is_formatting) || get(is_unformatting) 651 })); 652 653 append($$anchor, div_1); 654 }; 655 656 if_block(node_3, ($$render) => { 657 if (gradio.props.ui_mode === "both") $$render(consequent_2); 658 }); 659 } 660 661 var node_5 = sibling(node_3, 2); 662 663 { 664 var consequent_7 = ($$anchor) => { 665 var div_2 = root_6(); 666 let classes_2; 667 var node_6 = child(div_2); 668 669 { 670 var consequent_3 = ($$anchor) => { 671 var div_3 = root_7(); 672 673 transition(3, div_3, () => fade, () => ({ duration: 200 })); 674 append($$anchor, div_3); 675 }; 676 677 if_block(node_6, ($$render) => { 678 if (get(is_unformatting)) $$render(consequent_3); 679 }); 680 } 681 682 var node_7 = sibling(node_6, 2); 683 684 each(node_7, 17, () => get(dialogue_lines), index, ($$anchor, line, i) => { 685 var div_4 = root_8(); 686 var div_5 = child(div_4); 687 var node_8 = child(div_5); 688 689 { 690 var consequent_4 = ($$anchor) => { 691 var textarea = root_9(); 692 693 remove_textarea_child(textarea); 694 template_effect(() => textarea.disabled = get(disabled)); 695 bind_value(textarea, () => get(line).speaker, ($$value) => (get(line).speaker = $$value)); 696 append($$anchor, textarea); 697 }; 698 699 var alternate = ($$anchor) => { 700 { 701 let $0 = user_derived(() => gradio.props.speakers.map((s) => [s, s])); 702 703 Dropdown($$anchor, { 704 label: '', 705 show_label: false, 706 container: true, 707 interactive: true, 708 get value() { 709 return get(line).speaker; 710 }, 711 712 get choices() { 713 return get($0); 714 }, 715 on_change: (val) => update_line(i, "speaker", val) 716 }); 717 } 718 }; 719 720 if_block(node_8, ($$render) => { 721 if (get(disabled)) $$render(consequent_4); else $$render(alternate, false); 722 }); 723 } 724 725 reset(div_5); 726 727 var div_6 = sibling(div_5, 2); 728 var div_7 = child(div_6); 729 var textarea_1 = child(div_7); 730 731 remove_textarea_child(textarea_1); 732 bind_this(textarea_1, ($$value, i) => input_elements[i] = $$value, (i) => input_elements?.[i], () => [i]); 733 734 var node_9 = sibling(textarea_1, 2); 735 736 { 737 var consequent_5 = ($$anchor) => { 738 var div_8 = root_11();
739 var node_10 = child(div_8); 740 741 { 742 let $0 = user_derived(() => gradio.props.tags.map((s, i) => [s, i])); 743 let $1 = user_derived(() => get(filtered_tags).map((s) => gradio.props.tags.indexOf(s))); 744 let $2 = user_derived(() => get(filtered_tags).map((s) => gradio.props.tags.indexOf(s))[get(selectedOptionIndex)]); 745 746 DropdownOptions(node_10, { 747 get choices() { 748 return get($0); 749 }, 750 751 get filtered_indices() { 752 return get($1); 753 }, 754 755 get active_index() { 756 return get($2); 757 }, 758 show_options: true, 759 onchange: (e) => insert_tag(e), 760 get offset_from_top() { 761 return get(offset_from_top); 762 }, 763 from_top: true 764 }); 765 } 766 767 reset(div_8); 768 transition(3, div_8, () => fade, () => ({ duration: 100 })); 769 append($$anchor, div_8); 770 }; 771 772 if_block(node_9, ($$render) => { 773 if (get(showTagMenu) && get(currentLineIndex) === i) $$render(consequent_5); 774 }); 775 } 776 777 reset(div_7); 778 reset(div_6); 779
780 var node_11 = sibling(div_6, 2); 781 782 { 783 var consequent_6 = ($$anchor) => { 784 var div_9 = root_12(); 785 let classes_3; 786 var button = child(div_9); 787 var node_12 = child(button); 788 789 Plus(node_12); 790 reset(button); 791 reset(div_9); 792 793 template_effect(() => { 794 classes_3 = set_class(div_9, 1, 'svelte-1p54cvv', null, classes_3, { 'action-column': i == 0, hidden: get(disabled) }); 795 button.disabled = get(disabled); 796 }); 797 798 event('click', button, () => add_line(i)); 799 append($$anchor, div_9); 800 }; 801 802 if_block(node_11, ($$render) => { 803 if (gradio.props.max_lines == undefined || gradio.props.max_lines && i < gradio.props.max_lines - 1) $$render(consequent_6); 804 }); 805 } 806 807 var div_10 = sibling(node_11, 2); 808 let classes_4; 809 var button_1 = child(div_10); 810 var node_13 = child(button_1); 811 812 Trash(node_13); 813 reset(button_1); 814 reset(div_10); 815 reset(div_4); 816 817 template_effect(() => { 818 set_style(div_4, `--speaker-bg-color: ${(get(disabled) && (get(hoveredSpeaker) === null || get(hoveredSpeaker) === get(line).speaker) 819 ? get(speakerColors)[get(line).speaker] || 'transparent' 820 : 'transparent') ?? ''}`); 821 822 set_attribute(textarea_1, 'placeholder', gradio.props.placeholder); 823 textarea_1.disabled = get(disabled); 824 classes_4 = set_class(div_10, 1, 'action-column svelte-1p54cvv', null, classes_4, { hidden: get(disabled) || i == 0 }); 825 button_1.disabled = get(disabled); 826 }); 827 828 event('mouseenter', div_5, () => get(disabled) && set(hoveredSpeaker, get(line).speaker, true)); 829 event('mouseleave', div_5, () => get(disabled) && set(hoveredSpeaker, null)); 830 bind_value(textarea_1, () => get(line).text, ($$value) => (get(line).text = $$value)); 831 event('input', textarea_1, (event) => handle_input(event, i)); 832 event('focus', textarea_1, (event) => handle_input(event, i)); 833 834 event('keydown', textarea_1, (event) => { 835 if (event.key === "Escape" && get(showTagMenu)) { 836 set(showTagMenu, false); 837 set(selectedOptionIndex, 0); 838 event.preventDefault(); 839 } else if (get(showTagMenu) && get(currentLineIndex) === i) { 840 if (event.key === "ArrowDown") { 841 set(selectedOptionIndex, Math.min(get(selectedOptionIndex) + 1, get(filtered_tags).length - 1), true); 842 event.preventDefault(); 843 } else if (event.key === "ArrowUp") { 844 set(selectedOptionIndex, Math.max(get(selectedOptionIndex) - 1, 0), true); 845 event.preventDefault(); 846 } else if (event.key === "Enter") { 847 if (get(filtered_tags)[get(selectedOptionIndex)]) { 848 insert_selected_tag(); 849 } 850 851 event.preventDefault(); 852 } 853 } 854 }); 855 856 event('click', button_1, () => delete_line(i)); 857 append($$anchor, div_4); 858 }); 859 860 reset(div_2); 861 bind_this(div_2, ($$value) => dialogue_container_element = $$value, () => dialogue_container_element); 862 template_effect(() => classes_2 = set_class(div_2, 1, 'dialogue-container svelte-1p54cvv', null, classes_2, { loading: get(is_unformatting) })); 863 append($$anchor, div_2); 864 }; 865 866 var alternate_1 = ($$anchor) => { 867 var fragment_5 = comment(); 868 var node_14 = first_child(fragment_5); 869 870 { 871 var consequent_10 = ($$anchor) => { 872 var div_11 = root_14(); 873 let classes_5;
874 var node_15 = child(div_11); 875 876 { 877 var consequent_8 = ($$anchor) => { 878 var div_12 = root_15(); 879 880 transition(3, div_12, () => fade, () => ({ duration: 200 })); 881 append($$anchor, div_12); 882 }; 883 884 if_block(node_15, ($$render) => { 885 if (get(is_formatting)) $$render(consequent_8); 886 }); 887 } 888 889 var textarea_2 = sibling(node_15, 2); 890 891 remove_textarea_child(textarea_2); 892 set_attribute(textarea_2, 'rows', 5); 893 bind_this(textarea_2, ($$value) => textarea_element = $$value, () => textarea_element); 894 895 var node_16 = sibling(textarea_2, 2); 896 897 { 898 var consequent_9 = ($$anchor) => { 899 var div_13 = root_16(); 900 var node_17 = child(div_13); 901 902 { 903 let $0 = user_derived(() => gradio.props.tags.map((s, i) => [s, i])); 904 let $1 = user_derived(() => get(filtered_tags).map((s) => gradio.props.tags.indexOf(s))); 905 let $2 = user_derived(() => get(filtered_tags).map((s) => gradio.props.tags.indexOf(s))[get(selectedOptionIndex)]); 906 907 DropdownOptions(node_17, { 908 get choices() { 909 return get($0); 910 }, 911 912 get filtered_indices() { 913 return get($1); 914 }, 915 916 get active_index() { 917 return get($2); 918 }, 919 show_options: true, 920 $$events: { change: (e) => insert_tag(e) } 921 }); 922 } 923 924 reset(div_13); 925 transition(3, div_13, () => fade, () => ({ duration: 100 })); 926 append($$anchor, div_13); 927 }; 928 929 if_block(node_16, ($$render) => { 930 if (get(showTagMenu)) $$render(consequent_9); 931 }); 932 } 933 934 reset(div_11); 935 936 template_effect(() => { 937 classes_5 = set_class(div_11, 1, 'textarea-container svelte-1p54cvv', null, classes_5, { loading: get(is_formatting) }); 938 set_attribute(textarea_2, 'placeholder', gradio.props.placeholder); 939 textarea_2.disabled = get(disabled); 940 }); 941 942 bind_value(textarea_2, () => get(textbox_value), ($$value) => set(textbox_value, $$value)); 943 944 event('input', textarea_2, (event) => { 945 handle_input(event, 0); 946 gradio.props.value = get(textbox_value); 947 }); 948 949 event('focus', textarea_2, (event) => handle_input(event, 0)); 950 951 event('keydown', textarea_2, (event) => { 952 if (event.key === "Escape" && get(showTagMenu)) { 953 set(showTagMenu, false); 954 set(selectedOptionIndex, 0); 955 event.preventDefault(); 956 } else if (get(showTagMenu)) { 957 if (event.key === "ArrowDown") { 958 set(selectedOptionIndex, Math.min(get(selectedOptionIndex) + 1, get(filtered_tags).length - 1), true); 959 event.preventDefault(); 960 } else if (event.key === "ArrowUp") { 961 set(selectedOptionIndex, Math.max(get(selectedOptionIndex) - 1, 0), true); 962 event.preventDefault(); 963 } else if (event.key === "Enter") { 964 if (get(filtered_tags)[get(selectedOptionIndex)]) { 965 insert_selected_tag(); 966 } 967 968 event.preventDefault(); 969 } 970 } 971 }); 972 973 append($$anchor, div_11); 974 }; 975 976 if_block( 977 node_14, 978 ($$render) => { 979 if (get(checked) || gradio.props.ui_mode !== "dialogue") $$render(consequent_10); 980 }, 981 true 982 ); 983 } 984 985 append($$anchor, fragment_5); 986 }; 987 988 if_block(node_5, ($$render) => { 989 if (!get(checked) && gradio.props.ui_mode !== "text") $$render(consequent_7); else $$render(alternate_1, false); 990 }); 991 } 992 993 var node_18 = sibling(node_5, 2); 994 995 { 996 var consequent_12 = ($$anchor) => { 997 var div_14 = root_17(); 998 var button_2 = child(div_14); 999 var node_19 = child(button_2); 1000 1001 { 1002 var consequent_11 = ($$anchor) => { 1003 var text_2 = text(); 1004 1005 template_effect(() => set_text(text_2, gradio.props.submit_btn)); 1006 append($$anchor, text_2); 1007 }; 1008 1009 var alternate_2 = ($$anchor) => { 1010 Send($$anchor); 1011 }; 1012 1013 if_block(node_19, ($$render) => { 1014 if (typeof gradio.props.submit_btn === "string") $$render(consequent_11); else $$render(alternate_2, false); 1015 }); 1016 } 1017 1018 reset(button_2); 1019 reset(div_14); 1020 template_effect(() => button_2.disabled = get(disabled)); 1021 event('click', button_2, handle_submit); 1022 append($$anchor, div_14); 1023 }; 1024 1025 if_block(node_18, ($$render) => { 1026 if (gradio.props.submit_btn && !get(disabled)) $$render(consequent_12); 1027 }); 1028 } 1029 1030 reset(div); 1031 template_effect(() => classes = set_class(div, 1, 'svelte-1p54cvv', null, classes, { container: gradio.shared.container })); 1032 append($$anchor, div); 1033 pop(); 1034} 1035 1036var root_1 = from_html(`<!> <!>`, 1); 1037 1038function Index($$anchor, $$props) { 1039 push($$props, true); 1040 1041 const props = rest_props($$props, ['$$slots', '$$events', '$$legacy']); 1042 const gradio = new Gradio(props); 1043 1044 Block($$anchor, { 1045 get visible() { 1046 return gradio.shared.visible; 1047 }, 1048 1049 get elem_id() { 1050 return gradio.shared.elem_id; 1051 }, 1052 1053 get elem_classes() { 1054 return gradio.shared.elem_classes; 1055 }, 1056 1057 get scale() { 1058 return gradio.shared.scale; 1059 }, 1060 1061 get min_width() { 1062 return gradio.shared.min_width; 1063 }, 1064 allow_overflow: true, 1065 get padding() { 1066 return gradio.shared.container; 1067 }, 1068 1069 children: ($$anchor, $$slotProps) => { 1070 var fragment_1 = root_1(); 1071 var node = first_child(fragment_1); 1072 1073 { 1074 var consequent = ($$anchor) => { 1075 Static($$anchor, spread_props( 1076 { 1077 get autoscroll() { 1078 return gradio.shared.autoscroll; 1079 }, 1080 1081 get i18n() { 1082 return gradio.i18n; 1083 } 1084 }, 1085 () => gradio.shared.loading_status, 1086 { 1087 on_clear_status: () => gradio.dispatch("clear_status", gradio.shared.loading_status) 1088 } 1089 )); 1090 }; 1091 1092 if_block(node, ($$render) => { 1093 if (gradio.shared.loading_status) $$render(consequent); 1094 }); 1095 } 1096
1097 var node_1 = sibling(node, 2); 1098 1099 Dialogue(node_1, { 1100 get gradio() { 1101 return gradio; 1102 } 1103 }); 1104 1105 append($$anchor, fragment_1); 1106 }, 1107 $$slots: { default: true } 1108 }); 1109 1110 pop(); 1111} 1112 1113export { Dialogue as BaseDialogue, Index as default }; 1114//# sourceMappingURL=Index-gwNnLkdJ.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.