1import { B as Block } from './Button-f2ef1e3f.js'; 2import { S as Static } from './Index-f4e7a341.js'; 3import { U as UploadText } from './UploadText-78b5a93a.js'; 4import { B as BlockLabel } from './BlockLabel-b0ab52e0.js'; 5import { I as IconButton } from './IconButton-b1f250d1.js'; 6import { E as Empty } from './Empty-27f3e442.js'; 7import { S as ShareButton } from './ShareButton-c254ab08.js'; 8import { a as Download } from './DownloadLink-3c2b99a1.js'; 9import { I as Image } from './Image-6cbf81d1.js'; 10import { n as normalise_file } from './index-546f83db.js'; 11import './ModifyUpload.svelte_svelte_type_style_lang-6f675b46.js'; 12import { M as ModifyUpload } from './ModifyUpload-75b22e38.js'; 13import { I as Image$1 } from './Image-5414ffe6.js'; 14import { d as dequal } from './index-f38d9616.js'; 15import { u as uploadToHuggingFace } from './utils-8f25e669.js'; 16import { B as BaseFileUpload } from './FileUpload-0a3a0d80.js'; 17/* empty css */import './Upload-96564545.js'; 18import './file-url-c18a1f7c.js'; 19import './svelte/svelte.js'; 20import './Undo-6c110254.js'; 21import './File-e96cd7d6.js'; 22 23async function format_gallery_for_sharing(value) { 24 if (!value) 25 return ""; 26 let urls = await Promise.all( 27 value.map(async ([image, _]) => { 28 if (image === null || !image.url) 29 return ""; 30 return await uploadToHuggingFace(image.url, "url"); 31 }) 32 ); 33 return `<div style="display: flex; flex-wrap: wrap; gap: 16px">${urls.map((url) => `<img src="${url}" style="height: 400px" />`).join("")}</div>`; 34} 35 36const Gallery_svelte_svelte_type_style_lang = ''; 37 38/* home/runner/work/gradio/gradio/js/gallery/shared/Gallery.svelte generated by Svelte v4.2.2 */ 39const { 40 SvelteComponent: SvelteComponent$1, 41 add_iframe_resize_listener, 42 add_render_callback, 43 append, 44 attr, 45 binding_callbacks: binding_callbacks$1, 46 bubble, 47 check_outros: check_outros$1, 48 create_component: create_component$1, 49 destroy_component: destroy_component$1, 50 destroy_each, 51 detach: detach$1, 52 element, 53 empty: empty$1, 54 ensure_array_like, 55 globals, 56 group_outros: group_outros$1, 57 init: init$1, 58 insert: insert$1, 59 listen, 60 mount_component: mount_component$1, 61 run_all, 62 safe_not_equal: safe_not_equal$1, 63 set_data, 64 set_style, 65 space: space$1, 66 text, 67 toggle_class, 68 transition_in: transition_in$1, 69 transition_out: transition_out$1 70} = window.__gradio__svelte__internal; 71const { window: window_1 } = globals; 72const { createEventDispatcher: createEventDispatcher$1, getContext } = window.__gradio__svelte__internal;const { tick } = window.__gradio__svelte__internal; 73function get_each_context(ctx, list, i) { 74 const child_ctx = ctx.slice(); 75 child_ctx[45] = list[i]; 76 child_ctx[47] = i; 77 return child_ctx; 78} 79 80function get_each_context_1(ctx, list, i) { 81 const child_ctx = ctx.slice(); 82 child_ctx[48] = list[i]; 83 child_ctx[49] = list; 84 child_ctx[47] = i; 85 return child_ctx; 86} 87 88// (171:0) {#if show_label} 89function create_if_block_7(ctx) { 90 let blocklabel; 91 let current; 92 93 blocklabel = new BlockLabel({ 94 props: { 95 show_label: /*show_label*/ ctx[2], 96 Icon: Image, 97 label: /*label*/ ctx[3] || "Gallery" 98 } 99 }); 100 101 return { 102 c() { 103 create_component$1(blocklabel.$$.fragment); 104 }, 105 m(target, anchor) { 106 mount_component$1(blocklabel, target, anchor); 107 current = true; 108 }, 109 p(ctx, dirty) { 110 const blocklabel_changes = {}; 111 if (dirty[0] & /*show_label*/ 4) blocklabel_changes.show_label = /*show_label*/ ctx[2]; 112 if (dirty[0] & /*label*/ 8) blocklabel_changes.label = /*label*/ ctx[3] || "Gallery"; 113 blocklabel.$set(blocklabel_changes); 114 }, 115 i(local) { 116 if (current) return; 117 transition_in$1(blocklabel.$$.fragment, local); 118 current = true; 119 }, 120 o(local) { 121 transition_out$1(blocklabel.$$.fragment, local); 122 current = false; 123 }, 124 d(detaching) { 125 destroy_component$1(blocklabel, detaching); 126 } 127 }; 128} 129 130// (176:0) {:else} 131function create_else_block$1(ctx) { 132 let t0; 133 let div1; 134 let div0; 135 let t1; 136 let t2; 137 let div1_resize_listener; 138 let current; 139 let if_block0 = /*selected_image*/ ctx[18] && /*allow_preview*/ ctx[7] && create_if_block_4(ctx); 140 let if_block1 = /*interactive*/ ctx[12] && create_if_block_3(ctx); 141 let if_block2 = /*show_share_button*/ ctx[9] && create_if_block_2(ctx); 142 let each_value = ensure_array_like(/*resolved_value*/ ctx[13]); 143 let each_blocks = []; 144 145 for (let i = 0; i < each_value.length; i += 1) { 146 each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i)); 147 } 148 149 const out = i => transition_out$1(each_blocks[i], 1, 1, () => { 150 each_blocks[i] = null; 151 }); 152 153 return { 154 c() { 155 if (if_block0) if_block0.c(); 156 t0 = space$1(); 157 div1 = element("div"); 158 div0 = element("div"); 159 if (if_block1) if_block1.c(); 160 t1 = space$1(); 161 if (if_block2) if_block2.c(); 162 t2 = space$1(); 163 164 for (let i = 0; i < each_blocks.length; i += 1) { 165 each_blocks[i].c(); 166 } 167 168 attr(div0, "class", "grid-container svelte-2f9ynk");
169 set_style(div0, "--grid-cols", /*columns*/ ctx[4]); 170 set_style(div0, "--grid-rows", /*rows*/ ctx[5]); 171 set_style(div0, "--object-fit", /*object_fit*/ ctx[8]); 172 set_style(div0, "height", /*height*/ ctx[6]); 173 toggle_class(div0, "pt-6", /*show_label*/ ctx[2]); 174 attr(div1, "class", "grid-wrap svelte-2f9ynk"); 175 add_render_callback(() => /*div1_elementresize_handler*/ ctx[39].call(div1)); 176 toggle_class(div1, "fixed-height", !/*height*/ ctx[6] || /*height*/ ctx[6] == "auto"); 177 }, 178 m(target, anchor) { 179 if (if_block0) if_block0.m(target, anchor); 180 insert$1(target, t0, anchor); 181 insert$1(target, div1, anchor); 182 append(div1, div0); 183 if (if_block1) if_block1.m(div0, null); 184 append(div0, t1); 185 if (if_block2) if_block2.m(div0, null); 186 append(div0, t2); 187 188 for (let i = 0; i < each_blocks.length; i += 1) { 189 if (each_blocks[i]) { 190 each_blocks[i].m(div0, null); 191 } 192 } 193 194 div1_resize_listener = add_iframe_resize_listener(div1, /*div1_elementresize_handler*/ ctx[39].bind(div1)); 195 current = true; 196 }, 197 p(ctx, dirty) { 198 if (/*selected_image*/ ctx[18] && /*allow_preview*/ ctx[7]) { 199 if (if_block0) { 200 if_block0.p(ctx, dirty); 201 202 if (dirty[0] & /*selected_image, allow_preview*/ 262272) { 203 transition_in$1(if_block0, 1); 204 } 205 } else { 206 if_block0 = create_if_block_4(ctx); 207 if_block0.c(); 208 transition_in$1(if_block0, 1); 209 if_block0.m(t0.parentNode, t0); 210 } 211 } else if (if_block0) { 212 group_outros$1(); 213 214 transition_out$1(if_block0, 1, 1, () => { 215 if_block0 = null; 216 }); 217 218 check_outros$1(); 219 } 220 221 if (/*interactive*/ ctx[12]) { 222 if (if_block1) { 223 if_block1.p(ctx, dirty); 224 225 if (dirty[0] & /*interactive*/ 4096) { 226 transition_in$1(if_block1, 1); 227 } 228 } else { 229 if_block1 = create_if_block_3(ctx); 230 if_block1.c(); 231 transition_in$1(if_block1, 1); 232 if_block1.m(div0, t1); 233 } 234 } else if (if_block1) { 235 group_outros$1(); 236 237 transition_out$1(if_block1, 1, 1, () => { 238 if_block1 = null; 239 }); 240 241 check_outros$1(); 242 } 243 244 if (/*show_share_button*/ ctx[9]) { 245 if (if_block2) { 246 if_block2.p(ctx, dirty); 247 248 if (dirty[0] & /*show_share_button*/ 512) { 249 transition_in$1(if_block2, 1); 250 } 251 } else { 252 if_block2 = create_if_block_2(ctx); 253 if_block2.c(); 254 transition_in$1(if_block2, 1); 255 if_block2.m(div0, t2); 256 } 257 } else if (if_block2) { 258 group_outros$1(); 259 260 transition_out$1(if_block2, 1, 1, () => { 261 if_block2 = null; 262 }); 263 264 check_outros$1(); 265 } 266 267 if (dirty[0] & /*resolved_value, selected_index*/ 8194) { 268 each_value = ensure_array_like(/*resolved_value*/ ctx[13]); 269 let i; 270 271 for (i = 0; i < each_value.length; i += 1) { 272 const child_ctx = get_each_context(ctx, each_value, i); 273 274 if (each_blocks[i]) { 275 each_blocks[i].p(child_ctx, dirty); 276 transition_in$1(each_blocks[i], 1); 277 } else { 278 each_blocks[i] = create_each_block(child_ctx); 279 each_blocks[i].c(); 280 transition_in$1(each_blocks[i], 1); 281 each_blocks[i].m(div0, null); 282 } 283 } 284 285 group_outros$1(); 286 287 for (i = each_value.length; i < each_blocks.length; i += 1) { 288 out(i); 289 } 290 291 check_outros$1(); 292 } 293 294 if (!current || dirty[0] & /*columns*/ 16) { 295 set_style(div0, "--grid-cols", /*columns*/ ctx[4]); 296 } 297 298 if (!current || dirty[0] & /*rows*/ 32) { 299 set_style(div0, "--grid-rows", /*rows*/ ctx[5]); 300 } 301 302 if (!current || dirty[0] & /*object_fit*/ 256) { 303 set_style(div0, "--object-fit", /*object_fit*/ ctx[8]); 304 } 305 306 if (!current || dirty[0] & /*height*/ 64) { 307 set_style(div0, "height", /*height*/ ctx[6]); 308 } 309 310 if (!current || dirty[0] & /*show_label*/ 4) { 311 toggle_class(div0, "pt-6", /*show_label*/ ctx[2]); 312 } 313 314 if (!current || dirty[0] & /*height*/ 64) { 315 toggle_class(div1, "fixed-height", !/*height*/ ctx[6] || /*height*/ ctx[6] == "auto"); 316 } 317 }, 318 i(local) { 319 if (current) return; 320 transition_in$1(if_block0); 321 transition_in$1(if_block1); 322 transition_in$1(if_block2); 323 324 for (let i = 0; i < each_value.length; i += 1) { 325 transition_in$1(each_blocks[i]); 326 } 327 328 current = true; 329 }, 330 o(local) { 331 transition_out$1(if_block0); 332 transition_out$1(if_block1); 333 transition_out$1(if_block2);
334 each_blocks = each_blocks.filter(Boolean); 335 336 for (let i = 0; i < each_blocks.length; i += 1) { 337 transition_out$1(each_blocks[i]); 338 } 339 340 current = false; 341 }, 342 d(detaching) { 343 if (detaching) { 344 detach$1(t0); 345 detach$1(div1); 346 } 347 348 if (if_block0) if_block0.d(detaching); 349 if (if_block1) if_block1.d(); 350 if (if_block2) if_block2.d(); 351 destroy_each(each_blocks, detaching); 352 div1_resize_listener(); 353 } 354 }; 355} 356 357// (174:0) {#if value == null || resolved_value == null || resolved_value.length === 0} 358function create_if_block$1(ctx) { 359 let empty_1; 360 let current; 361 362 empty_1 = new Empty({ 363 props: { 364 unpadded_box: true, 365 size: "large", 366 $$slots: { default: [create_default_slot$1] }, 367 $$scope: { ctx } 368 } 369 }); 370 371 return { 372 c() { 373 create_component$1(empty_1.$$.fragment); 374 }, 375 m(target, anchor) { 376 mount_component$1(empty_1, target, anchor); 377 current = true; 378 }, 379 p(ctx, dirty) { 380 const empty_1_changes = {}; 381 382 if (dirty[1] & /*$$scope*/ 524288) { 383 empty_1_changes.$$scope = { dirty, ctx }; 384 } 385 386 empty_1.$set(empty_1_changes); 387 }, 388 i(local) { 389 if (current) return; 390 transition_in$1(empty_1.$$.fragment, local); 391 current = true; 392 }, 393 o(local) { 394 transition_out$1(empty_1.$$.fragment, local); 395 current = false; 396 }, 397 d(detaching) { 398 destroy_component$1(empty_1, detaching); 399 } 400 }; 401} 402 403// (177:1) {#if selected_image && allow_preview} 404function create_if_block_4(ctx) { 405 let button1; 406 let div0; 407 let t0; 408 let modifyupload; 409 let t1; 410 let button0; 411 let image_1; 412 let t2; 413 let t3; 414 let div1; 415 let current; 416 let mounted; 417 let dispose; 418 let if_block0 = /*show_download_button*/ ctx[10] && create_if_block_6(ctx); 419 420 modifyupload = new ModifyUpload({ 421 props: { i18n: /*i18n*/ ctx[11], absolute: false } 422 }); 423 424 modifyupload.$on("clear", /*clear_handler*/ ctx[30]); 425 426 image_1 = new Image$1({ 427 props: { 428 "data-testid": "detailed-image", 429 src: /*selected_image*/ ctx[18].image.url, 430 alt: /*selected_image*/ ctx[18].caption || "", 431 title: /*selected_image*/ ctx[18].caption || null, 432 class: /*selected_image*/ ctx[18].caption && "with-caption", 433 loading: "lazy" 434 } 435 }); 436 437 let if_block1 = /*selected_image*/ ctx[18]?.caption && create_if_block_5(ctx); 438 let each_value_1 = ensure_array_like(/*resolved_value*/ ctx[13]); 439 let each_blocks = []; 440 441 for (let i = 0; i < each_value_1.length; i += 1) { 442 each_blocks[i] = create_each_block_1(get_each_context_1(ctx, each_value_1, i)); 443 } 444 445 const out = i => transition_out$1(each_blocks[i], 1, 1, () => { 446 each_blocks[i] = null; 447 }); 448 449 return { 450 c() { 451 button1 = element("button"); 452 div0 = element("div"); 453 if (if_block0) if_block0.c(); 454 t0 = space$1(); 455 create_component$1(modifyupload.$$.fragment); 456 t1 = space$1(); 457 button0 = element("button"); 458 create_component$1(image_1.$$.fragment); 459 t2 = space$1(); 460 if (if_block1) if_block1.c(); 461 t3 = space$1(); 462 div1 = element("div"); 463 464 for (let i = 0; i < each_blocks.length; i += 1) { 465 each_blocks[i].c(); 466 } 467 468 attr(div0, "class", "icon-buttons svelte-2f9ynk"); 469 attr(button0, "class", "image-button svelte-2f9ynk"); 470 set_style(button0, "height", "calc(100% - " + (/*selected_image*/ ctx[18].caption ? '80px' : '60px') + ")"); 471 attr(button0, "aria-label", "detailed view of selected image"); 472 attr(div1, "class", "thumbnails scroll-hide svelte-2f9ynk"); 473 attr(div1, "data-testid", "container_el"); 474 attr(button1, "class", "preview svelte-2f9ynk"); 475 }, 476 m(target, anchor) { 477 insert$1(target, button1, anchor); 478 append(button1, div0); 479 if (if_block0) if_block0.m(div0, null); 480 append(div0, t0);
481 mount_component$1(modifyupload, div0, null); 482 append(button1, t1); 483 append(button1, button0); 484 mount_component$1(image_1, button0, null); 485 append(button1, t2); 486 if (if_block1) if_block1.m(button1, null); 487 append(button1, t3); 488 append(button1, div1); 489 490 for (let i = 0; i < each_blocks.length; i += 1) { 491 if (each_blocks[i]) { 492 each_blocks[i].m(div1, null); 493 } 494 } 495 496 /*div1_binding*/ ctx[34](div1); 497 current = true; 498 499 if (!mounted) { 500 dispose = [ 501 listen(button0, "click", /*click_handler_1*/ ctx[31]), 502 listen(button1, "keydown", /*on_keydown*/ ctx[20]) 503 ]; 504 505 mounted = true; 506 } 507 }, 508 p(ctx, dirty) { 509 if (/*show_download_button*/ ctx[10]) { 510 if (if_block0) { 511 if_block0.p(ctx, dirty); 512 513 if (dirty[0] & /*show_download_button*/ 1024) { 514 transition_in$1(if_block0, 1); 515 } 516 } else { 517 if_block0 = create_if_block_6(ctx); 518 if_block0.c(); 519 transition_in$1(if_block0, 1); 520 if_block0.m(div0, t0); 521 } 522 } else if (if_block0) { 523 group_outros$1(); 524 525 transition_out$1(if_block0, 1, 1, () => { 526 if_block0 = null; 527 }); 528 529 check_outros$1(); 530 } 531 532 const modifyupload_changes = {}; 533 if (dirty[0] & /*i18n*/ 2048) modifyupload_changes.i18n = /*i18n*/ ctx[11]; 534 modifyupload.$set(modifyupload_changes); 535 const image_1_changes = {}; 536 if (dirty[0] & /*selected_image*/ 262144) image_1_changes.src = /*selected_image*/ ctx[18].image.url; 537 if (dirty[0] & /*selected_image*/ 262144) image_1_changes.alt = /*selected_image*/ ctx[18].caption || ""; 538 if (dirty[0] & /*selected_image*/ 262144) image_1_changes.title = /*selected_image*/ ctx[18].caption || null; 539 if (dirty[0] & /*selected_image*/ 262144) image_1_changes.class = /*selected_image*/ ctx[18].caption && "with-caption"; 540 image_1.$set(image_1_changes); 541 542 if (!current || dirty[0] & /*selected_image*/ 262144) { 543 set_style(button0, "height", "calc(100% - " + (/*selected_image*/ ctx[18].caption ? '80px' : '60px') + ")"); 544 } 545 546 if (/*selected_image*/ ctx[18]?.caption) { 547 if (if_block1) { 548 if_block1.p(ctx, dirty); 549 } else { 550 if_block1 = create_if_block_5(ctx); 551 if_block1.c(); 552 if_block1.m(button1, t3); 553 } 554 } else if (if_block1) { 555 if_block1.d(1); 556 if_block1 = null; 557 } 558 559 if (dirty[0] & /*resolved_value, el, selected_index*/ 24578) { 560 each_value_1 = ensure_array_like(/*resolved_value*/ ctx[13]); 561 let i; 562 563 for (i = 0; i < each_value_1.length; i += 1) { 564 const child_ctx = get_each_context_1(ctx, each_value_1, i); 565 566 if (each_blocks[i]) { 567 each_blocks[i].p(child_ctx, dirty); 568 transition_in$1(each_blocks[i], 1); 569 } else { 570 each_blocks[i] = create_each_block_1(child_ctx); 571 each_blocks[i].c(); 572 transition_in$1(each_blocks[i], 1); 573 each_blocks[i].m(div1, null); 574 } 575 } 576 577 group_outros$1(); 578 579 for (i = each_value_1.length; i < each_blocks.length; i += 1) { 580 out(i); 581 } 582 583 check_outros$1(); 584 } 585 }, 586 i(local) { 587 if (current) return; 588 transition_in$1(if_block0); 589 transition_in$1(modifyupload.$$.fragment, local); 590 transition_in$1(image_1.$$.fragment, local); 591 592 for (let i = 0; i < each_value_1.length; i += 1) { 593 transition_in$1(each_blocks[i]); 594 } 595 596 current = true; 597 }, 598 o(local) { 599 transition_out$1(if_block0); 600 transition_out$1(modifyupload.$$.fragment, local); 601 transition_out$1(image_1.$$.fragment, local);
602 each_blocks = each_blocks.filter(Boolean); 603 604 for (let i = 0; i < each_blocks.length; i += 1) { 605 transition_out$1(each_blocks[i]); 606 } 607 608 current = false; 609 }, 610 d(detaching) { 611 if (detaching) { 612 detach$1(button1); 613 } 614 615 if (if_block0) if_block0.d(); 616 destroy_component$1(modifyupload); 617 destroy_component$1(image_1); 618 if (if_block1) if_block1.d(); 619 destroy_each(each_blocks, detaching); 620 /*div1_binding*/ ctx[34](null); 621 mounted = false; 622 run_all(dispose); 623 } 624 }; 625} 626 627// (180:4) {#if show_download_button} 628function create_if_block_6(ctx) { 629 let div; 630 let iconbutton; 631 let current; 632 633 iconbutton = new IconButton({ 634 props: { 635 Icon: Download, 636 label: /*i18n*/ ctx[11]("common.download") 637 } 638 }); 639 640 iconbutton.$on("click", /*click_handler*/ ctx[29]); 641 642 return { 643 c() { 644 div = element("div"); 645 create_component$1(iconbutton.$$.fragment); 646 attr(div, "class", "download-button-container svelte-2f9ynk"); 647 }, 648 m(target, anchor) { 649 insert$1(target, div, anchor); 650 mount_component$1(iconbutton, div, null); 651 current = true; 652 }, 653 p(ctx, dirty) { 654 const iconbutton_changes = {}; 655 if (dirty[0] & /*i18n*/ 2048) iconbutton_changes.label = /*i18n*/ ctx[11]("common.download"); 656 iconbutton.$set(iconbutton_changes); 657 }, 658 i(local) { 659 if (current) return; 660 transition_in$1(iconbutton.$$.fragment, local); 661 current = true; 662 }, 663 o(local) { 664 transition_out$1(iconbutton.$$.fragment, local); 665 current = false; 666 }, 667 d(detaching) { 668 if (detaching) { 669 detach$1(div); 670 } 671 672 destroy_component$1(iconbutton); 673 } 674 }; 675} 676 677// (220:3) {#if selected_image?.caption} 678function create_if_block_5(ctx) { 679 let caption; 680 let t_value = /*selected_image*/ ctx[18].caption + ""; 681 let t; 682 683 return { 684 c() { 685 caption = element("caption"); 686 t = text(t_value); 687 attr(caption, "class", "caption svelte-2f9ynk"); 688 }, 689 m(target, anchor) { 690 insert$1(target, caption, anchor); 691 append(caption, t); 692 }, 693 p(ctx, dirty) { 694 if (dirty[0] & /*selected_image*/ 262144 && t_value !== (t_value = /*selected_image*/ ctx[18].caption + "")) set_data(t, t_value); 695 }, 696 d(detaching) { 697 if (detaching) { 698 detach$1(caption); 699 } 700 } 701 }; 702} 703 704// (230:4) {#each resolved_value as image, i} 705function create_each_block_1(ctx) { 706 let button; 707 let image_1; 708 let t; 709 let button_aria_label_value; 710 let i = /*i*/ ctx[47]; 711 let current; 712 let mounted; 713 let dispose; 714 715 image_1 = new Image$1({ 716 props: { 717 src: /*image*/ ctx[48].image.url, 718 title: /*image*/ ctx[48].caption || null, 719 "data-testid": "thumbnail " + (/*i*/ ctx[47] + 1), 720 alt: "", 721 loading: "lazy" 722 } 723 }); 724 725 const assign_button = () => /*button_binding*/ ctx[32](button, i); 726 const unassign_button = () => /*button_binding*/ ctx[32](null, i); 727 728 function click_handler_2() { 729 return /*click_handler_2*/ ctx[33](/*i*/ ctx[47]); 730 } 731 732 return { 733 c() { 734 button = element("button"); 735 create_component$1(image_1.$$.fragment); 736 t = space$1(); 737 attr(button, "class", "thumbnail-item thumbnail-small svelte-2f9ynk"); 738 attr(button, "aria-label", button_aria_label_value = "Thumbnail " + (/*i*/ ctx[47] + 1) + " of " + /*resolved_value*/ ctx[13].length); 739 toggle_class(button, "selected", /*selected_index*/ ctx[1] === /*i*/ ctx[47]); 740 }, 741 m(target, anchor) { 742 insert$1(target, button, anchor); 743 mount_component$1(image_1, button, null); 744 append(button, t); 745 assign_button(); 746 current = true; 747 748 if (!mounted) { 749 dispose = listen(button, "click", click_handler_2); 750 mounted = true; 751 } 752 }, 753 p(new_ctx, dirty) { 754 ctx = new_ctx; 755 const image_1_changes = {}; 756 if (dirty[0] & /*resolved_value*/ 8192) image_1_changes.src = /*image*/ ctx[48].image.url; 757 if (dirty[0] & /*resolved_value*/ 8192) image_1_changes.title = /*image*/ ctx[48].caption || null; 758 image_1.$set(image_1_changes); 759 760 if (!current || dirty[0] & /*resolved_value*/ 8192 && button_aria_label_value !== (button_aria_label_value = "Thumbnail " + (/*i*/ ctx[47] + 1) + " of " + /*resolved_value*/ ctx[13].length)) { 761 attr(button, "aria-label", button_aria_label_value); 762 } 763 764 if (i !== /*i*/ ctx[47]) { 765 unassign_button(); 766 i = /*i*/ ctx[47]; 767 assign_button(); 768 } 769 770 if (!current || dirty[0] & /*selected_index*/ 2) { 771 toggle_class(button, "selected", /*selected_index*/ ctx[1] === /*i*/ ctx[47]); 772 } 773 }, 774 i(local) { 775 if (current) return; 776 transition_in$1(image_1.$$.fragment, local); 777 current = true; 778 }, 779 o(local) { 780 transition_out$1(image_1.$$.fragment, local); 781 current = false;
782 }, 783 d(detaching) { 784 if (detaching) { 785 detach$1(button); 786 } 787 788 destroy_component$1(image_1); 789 unassign_button(); 790 mounted = false; 791 dispose(); 792 } 793 }; 794} 795 796// (261:3) {#if interactive} 797function create_if_block_3(ctx) { 798 let div; 799 let modifyupload; 800 let current; 801 802 modifyupload = new ModifyUpload({ 803 props: { i18n: /*i18n*/ ctx[11], absolute: false } 804 }); 805 806 modifyupload.$on("clear", /*clear_handler_1*/ ctx[35]); 807 808 return { 809 c() { 810 div = element("div"); 811 create_component$1(modifyupload.$$.fragment); 812 attr(div, "class", "icon-button svelte-2f9ynk"); 813 }, 814 m(target, anchor) { 815 insert$1(target, div, anchor); 816 mount_component$1(modifyupload, div, null); 817 current = true; 818 }, 819 p(ctx, dirty) { 820 const modifyupload_changes = {}; 821 if (dirty[0] & /*i18n*/ 2048) modifyupload_changes.i18n = /*i18n*/ ctx[11]; 822 modifyupload.$set(modifyupload_changes); 823 }, 824 i(local) { 825 if (current) return; 826 transition_in$1(modifyupload.$$.fragment, local); 827 current = true; 828 }, 829 o(local) { 830 transition_out$1(modifyupload.$$.fragment, local); 831 current = false; 832 }, 833 d(detaching) { 834 if (detaching) { 835 detach$1(div); 836 } 837 838 destroy_component$1(modifyupload); 839 } 840 }; 841} 842 843// (270:3) {#if show_share_button} 844function create_if_block_2(ctx) { 845 let div; 846 let sharebutton; 847 let current; 848 849 sharebutton = new ShareButton({ 850 props: { 851 i18n: /*i18n*/ ctx[11], 852 value: /*resolved_value*/ ctx[13], 853 formatter: format_gallery_for_sharing 854 } 855 }); 856 857 sharebutton.$on("share", /*share_handler*/ ctx[36]); 858 sharebutton.$on("error", /*error_handler*/ ctx[37]); 859 860 return { 861 c() { 862 div = element("div"); 863 create_component$1(sharebutton.$$.fragment); 864 attr(div, "class", "icon-button svelte-2f9ynk"); 865 }, 866 m(target, anchor) { 867 insert$1(target, div, anchor); 868 mount_component$1(sharebutton, div, null); 869 current = true; 870 }, 871 p(ctx, dirty) { 872 const sharebutton_changes = {}; 873 if (dirty[0] & /*i18n*/ 2048) sharebutton_changes.i18n = /*i18n*/ ctx[11]; 874 if (dirty[0] & /*resolved_value*/ 8192) sharebutton_changes.value = /*resolved_value*/ ctx[13]; 875 sharebutton.$set(sharebutton_changes); 876 }, 877 i(local) { 878 if (current) return; 879 transition_in$1(sharebutton.$$.fragment, local); 880 current = true; 881 }, 882 o(local) { 883 transition_out$1(sharebutton.$$.fragment, local); 884 current = false; 885 }, 886 d(detaching) { 887 if (detaching) { 888 detach$1(div); 889 } 890 891 destroy_component$1(sharebutton); 892 } 893 }; 894} 895 896// (295:5) {#if entry.caption} 897function create_if_block_1(ctx) { 898 let div; 899 let t_value = /*entry*/ ctx[45].caption + ""; 900 let t; 901 902 return { 903 c() { 904 div = element("div"); 905 t = text(t_value); 906 attr(div, "class", "caption-label svelte-2f9ynk"); 907 }, 908 m(target, anchor) { 909 insert$1(target, div, anchor); 910 append(div, t); 911 }, 912 p(ctx, dirty) { 913 if (dirty[0] & /*resolved_value*/ 8192 && t_value !== (t_value = /*entry*/ ctx[45].caption + "")) set_data(t, t_value); 914 }, 915 d(detaching) { 916 if (detaching) { 917 detach$1(div); 918 } 919 } 920 }; 921} 922 923// (281:3) {#each resolved_value as entry, i} 924function create_each_block(ctx) { 925 let button; 926 let image_1; 927 let t0; 928 let t1; 929 let button_aria_label_value; 930 let current; 931 let mounted; 932 let dispose; 933 934 image_1 = new Image$1({ 935 props: { 936 alt: /*entry*/ ctx[45].caption || "", 937 src: typeof /*entry*/ ctx[45].image === "string" 938 ? /*entry*/ ctx[45].image 939 : /*entry*/ ctx[45].image.url, 940 loading: "lazy" 941 } 942 }); 943 944 let if_block = /*entry*/ ctx[45].caption && create_if_block_1(ctx); 945 946 function click_handler_3() { 947 return /*click_handler_3*/ ctx[38](/*i*/ ctx[47]); 948 } 949 950 return { 951 c() { 952 button = element("button"); 953 create_component$1(image_1.$$.fragment); 954 t0 = space$1(); 955 if (if_block) if_block.c(); 956 t1 = space$1(); 957 attr(button, "class", "thumbnail-item thumbnail-lg svelte-2f9ynk"); 958 attr(button, "aria-label", button_aria_label_value = "Thumbnail " + (/*i*/ ctx[47] + 1) + " of " + /*resolved_value*/ ctx[13].length); 959 toggle_class(button, "selected", /*selected_index*/ ctx[1] === /*i*/ ctx[47]); 960 }, 961 m(target, anchor) { 962 insert$1(target, button, anchor);
963 mount_component$1(image_1, button, null); 964 append(button, t0); 965 if (if_block) if_block.m(button, null); 966 append(button, t1); 967 current = true; 968 969 if (!mounted) { 970 dispose = listen(button, "click", click_handler_3); 971 mounted = true; 972 } 973 }, 974 p(new_ctx, dirty) { 975 ctx = new_ctx; 976 const image_1_changes = {}; 977 if (dirty[0] & /*resolved_value*/ 8192) image_1_changes.alt = /*entry*/ ctx[45].caption || ""; 978 979 if (dirty[0] & /*resolved_value*/ 8192) image_1_changes.src = typeof /*entry*/ ctx[45].image === "string" 980 ? /*entry*/ ctx[45].image 981 : /*entry*/ ctx[45].image.url; 982 983 image_1.$set(image_1_changes); 984 985 if (/*entry*/ ctx[45].caption) { 986 if (if_block) { 987 if_block.p(ctx, dirty); 988 } else { 989 if_block = create_if_block_1(ctx); 990 if_block.c(); 991 if_block.m(button, t1); 992 } 993 } else if (if_block) { 994 if_block.d(1); 995 if_block = null; 996 } 997 998 if (!current || dirty[0] & /*resolved_value*/ 8192 && button_aria_label_value !== (button_aria_label_value = "Thumbnail " + (/*i*/ ctx[47] + 1) + " of " + /*resolved_value*/ ctx[13].length)) { 999 attr(button, "aria-label", button_aria_label_value); 1000 } 1001 1002 if (!current || dirty[0] & /*selected_index*/ 2) { 1003 toggle_class(button, "selected", /*selected_index*/ ctx[1] === /*i*/ ctx[47]); 1004 } 1005 }, 1006 i(local) { 1007 if (current) return; 1008 transition_in$1(image_1.$$.fragment, local); 1009 current = true; 1010 }, 1011 o(local) { 1012 transition_out$1(image_1.$$.fragment, local); 1013 current = false; 1014 }, 1015 d(detaching) { 1016 if (detaching) { 1017 detach$1(button); 1018 } 1019 1020 destroy_component$1(image_1); 1021 if (if_block) if_block.d(); 1022 mounted = false; 1023 dispose(); 1024 } 1025 }; 1026} 1027 1028// (175:1) <Empty unpadded_box={true} size="large"> 1029function create_default_slot$1(ctx) { 1030 let imageicon; 1031 let current; 1032 imageicon = new Image({}); 1033 1034 return { 1035 c() { 1036 create_component$1(imageicon.$$.fragment); 1037 }, 1038 m(target, anchor) { 1039 mount_component$1(imageicon, target, anchor); 1040 current = true; 1041 }, 1042 i(local) { 1043 if (current) return; 1044 transition_in$1(imageicon.$$.fragment, local); 1045 current = true; 1046 }, 1047 o(local) { 1048 transition_out$1(imageicon.$$.fragment, local); 1049 current = false; 1050 }, 1051 d(detaching) { 1052 destroy_component$1(imageicon, detaching); 1053 } 1054 }; 1055} 1056 1057function create_fragment$1(ctx) { 1058 let t; 1059 let current_block_type_index; 1060 let if_block1; 1061 let if_block1_anchor; 1062 let current; 1063 let mounted; 1064 let dispose; 1065 add_render_callback(/*onwindowresize*/ ctx[28]); 1066 let if_block0 = /*show_label*/ ctx[2] && create_if_block_7(ctx); 1067 const if_block_creators = [create_if_block$1, create_else_block$1]; 1068 const if_blocks = []; 1069 1070 function select_block_type(ctx, dirty) { 1071 if (/*value*/ ctx[0] == null || /*resolved_value*/ ctx[13] == null || /*resolved_value*/ ctx[13].length === 0) return 0; 1072 return 1; 1073 } 1074 1075 current_block_type_index = select_block_type(ctx); 1076 if_block1 = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 1077 1078 return { 1079 c() { 1080 if (if_block0) if_block0.c(); 1081 t = space$1(); 1082 if_block1.c(); 1083 if_block1_anchor = empty$1(); 1084 }, 1085 m(target, anchor) { 1086 if (if_block0) if_block0.m(target, anchor); 1087 insert$1(target, t, anchor); 1088 if_blocks[current_block_type_index].m(target, anchor); 1089 insert$1(target, if_block1_anchor, anchor); 1090 current = true; 1091 1092 if (!mounted) { 1093 dispose = listen(window_1, "resize", /*onwindowresize*/ ctx[28]); 1094 mounted = true; 1095 } 1096 }, 1097 p(ctx, dirty) { 1098 if (/*show_label*/ ctx[2]) { 1099 if (if_block0) { 1100 if_block0.p(ctx, dirty); 1101 1102 if (dirty[0] & /*show_label*/ 4) { 1103 transition_in$1(if_block0, 1); 1104 } 1105 } else { 1106 if_block0 = create_if_block_7(ctx); 1107 if_block0.c(); 1108 transition_in$1(if_block0, 1); 1109 if_block0.m(t.parentNode, t); 1110 } 1111 } else if (if_block0) { 1112 group_outros$1(); 1113 1114 transition_out$1(if_block0, 1, 1, () => { 1115 if_block0 = null; 1116 }); 1117 1118 check_outros$1(); 1119 } 1120 1121 let previous_block_index = current_block_type_index; 1122 current_block_type_index = select_block_type(ctx); 1123 1124 if (current_block_type_index === previous_block_index) { 1125 if_blocks[current_block_type_index].p(ctx, dirty); 1126 } else { 1127 group_outros$1(); 1128 1129 transition_out$1(if_blocks[previous_block_index], 1, 1, () => { 1130 if_blocks[previous_block_index] = null; 1131 }); 1132 1133 check_outros$1(); 1134 if_block1 = if_blocks[current_block_type_index]; 1135 1136 if (!if_block1) { 1137 if_block1 = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 1138 if_block1.c(); 1139 } else { 1140 if_block1.p(ctx, dirty); 1141 } 1142 1143 transition_in$1(if_block1, 1); 1144 if_block1.m(if_block1_anchor.parentNode, if_block1_anchor); 1145 } 1146 }, 1147 i(local) { 1148 if (current) return; 1149 transition_in$1(if_block0); 1150 transition_in$1(if_block1); 1151 current = true; 1152 }, 1153 o(local) { 1154 transition_out$1(if_block0); 1155 transition_out$1(if_block1); 1156 current = false;
1157 }, 1158 d(detaching) { 1159 if (detaching) { 1160 detach$1(t); 1161 detach$1(if_block1_anchor); 1162 } 1163 1164 if (if_block0) if_block0.d(detaching); 1165 if_blocks[current_block_type_index].d(detaching); 1166 mounted = false; 1167 dispose(); 1168 } 1169 }; 1170} 1171 1172function instance$1($$self, $$props, $$invalidate) { 1173 let previous; 1174 let next; 1175 let selected_image; 1176 let { show_label = true } = $$props; 1177 let { label } = $$props; 1178 let { root = "" } = $$props; 1179 let { proxy_url = null } = $$props; 1180 let { value = null } = $$props; 1181 let { columns = [2] } = $$props; 1182 let { rows = undefined } = $$props; 1183 let { height = "auto" } = $$props; 1184 let { preview } = $$props; 1185 let { allow_preview = true } = $$props; 1186 let { object_fit = "cover" } = $$props; 1187 let { show_share_button = false } = $$props; 1188 let { show_download_button = false } = $$props; 1189 let { i18n } = $$props; 1190 let { selected_index = null } = $$props; 1191 let { interactive } = $$props; 1192 const dispatch = createEventDispatcher$1(); 1193 1194 // tracks whether the value of the gallery was reset 1195 let was_reset = true; 1196 1197 let resolved_value = null; 1198 let prev_value = value; 1199 1200 if (selected_index == null && preview && value?.length) { 1201 selected_index = 0; 1202 } 1203 1204 let old_selected_index = selected_index; 1205 1206 function handle_preview_click(event) { 1207 const element = event.target; 1208 const x = event.clientX; 1209 const width = element.offsetWidth; 1210 const centerX = width / 2; 1211 1212 if (x < centerX) { 1213 $$invalidate(1, selected_index = previous); 1214 } else { 1215 $$invalidate(1, selected_index = next); 1216 } 1217 } 1218 1219 function on_keydown(e) { 1220 switch (e.code) { 1221 case "Escape": 1222 e.preventDefault(); 1223 $$invalidate(1, selected_index = null); 1224 break; 1225 case "ArrowLeft": 1226 e.preventDefault(); 1227 $$invalidate(1, selected_index = previous); 1228 break; 1229 case "ArrowRight": 1230 e.preventDefault(); 1231 $$invalidate(1, selected_index = next); 1232 break; 1233 } 1234 } 1235 1236 let el = []; 1237 let container_element; 1238 1239 async function scroll_to_img(index) { 1240 if (typeof index !== "number") return; 1241 await tick(); 1242 if (el[index] === undefined) return; 1243 el[index]?.focus();
1244 const { left: container_left, width: container_width } = container_element.getBoundingClientRect(); 1245 const { left, width } = el[index].getBoundingClientRect(); 1246 const relative_left = left - container_left; 1247 const pos = relative_left + width / 2 - container_width / 2 + container_element.scrollLeft; 1248 1249 if (container_element && typeof container_element.scrollTo === "function") { 1250 container_element.scrollTo({ 1251 left: pos < 0 ? 0 : pos, 1252 behavior: "smooth" 1253 }); 1254 } 1255 } 1256 1257 let client_height = 0; 1258 let window_height = 0; 1259 1260 // Unlike `gr.Image()`, images specified via remote URLs are not cached in the server 1261 // and their remote URLs are directly passed to the client as `value[].image.url`. 1262 // The `download` attribute of the <a> tag doesn't work for remote URLs (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download), 1263 // so we need to download the image via JS as below. 1264 const fetch_implementation = getContext("fetch_implementation"); 1265 1266 async function download(file_url, name) { 1267 let response; 1268 1269 try { 1270 response = await fetch_implementation(file_url); 1271 } catch(error) { 1272 if (error instanceof TypeError) { 1273 // If CORS is not allowed (https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#checking_that_the_fetch_was_successful), 1274 // open the link in a new tab instead, mimicing the behavior of the `download` attribute for remote URLs, 1275 // which is not ideal, but a reasonable fallback. 1276 window.open(file_url, "_blank", "noreferrer"); 1277 1278 return; 1279 } 1280 1281 throw error; 1282 } 1283 1284 const blob = await response.blob(); 1285 const url = URL.createObjectURL(blob); 1286 const link = document.createElement("a"); 1287 link.href = url;
1288 link.download = name; 1289 link.click(); 1290 URL.revokeObjectURL(url); 1291 } 1292 1293 function onwindowresize() { 1294 $$invalidate(17, window_height = window_1.innerHeight); 1295 } 1296 1297 const click_handler = () => { 1298 const image = selected_image?.image; 1299 1300 if (image == null) { 1301 return; 1302 } 1303 1304 const { url, orig_name } = image; 1305 1306 if (url) { 1307 download(url, orig_name ?? "image"); 1308 } 1309 }; 1310 1311 const clear_handler = () => $$invalidate(1, selected_index = null); 1312 const click_handler_1 = event => handle_preview_click(event); 1313 1314 function button_binding($$value, i) { 1315 binding_callbacks$1[$$value ? 'unshift' : 'push'](() => { 1316 el[i] = $$value; 1317 $$invalidate(14, el); 1318 }); 1319 } 1320 1321 const click_handler_2 = i => $$invalidate(1, selected_index = i); 1322 1323 function div1_binding($$value) { 1324 binding_callbacks$1[$$value ? 'unshift' : 'push'](() => { 1325 container_element = $$value; 1326 $$invalidate(15, container_element); 1327 }); 1328 } 1329 1330 const clear_handler_1 = () => $$invalidate(0, value = null); 1331 1332 function share_handler(event) { 1333 bubble.call(this, $$self, event); 1334 } 1335 1336 function error_handler(event) { 1337 bubble.call(this, $$self, event); 1338 } 1339 1340 const click_handler_3 = i =>
1340 $$invalidate(1, selected_index = i); 1341 1342 function div1_elementresize_handler() { 1343 client_height = this.clientHeight; 1344 $$invalidate(16, client_height); 1345 } 1346 1347 $$self.$$set = $$props => { 1348 if ('show_label' in $$props) $$invalidate(2, show_label = $$props.show_label); 1349 if ('label' in $$props) $$invalidate(3, label = $$props.label); 1350 if ('root' in $$props) $$invalidate(22, root = $$props.root); 1351 if ('proxy_url' in $$props) $$invalidate(23, proxy_url = $$props.proxy_url); 1352 if ('value' in $$props) $$invalidate(0, value = $$props.value); 1353 if ('columns' in $$props) $$invalidate(4, columns = $$props.columns); 1354 if ('rows' in $$props) $$invalidate(5, rows = $$props.rows); 1355 if ('height' in $$props) $$invalidate(6, height = $$props.height); 1356 if ('preview' in $$props) $$invalidate(24, preview = $$props.preview); 1357 if ('allow_preview' in $$props) $$invalidate(7, allow_preview = $$props.allow_preview); 1358 if ('object_fit' in $$props) $$invalidate(8, object_fit = $$props.object_fit); 1359 if ('show_share_button' in $$props) $$invali
1359date(9, show_share_button = $$props.show_share_button); 1360 if ('show_download_button' in $$props) $$invalidate(10, show_download_button = $$props.show_download_button); 1361 if ('i18n' in $$props) $$invalidate(11, i18n = $$props.i18n); 1362 if ('selected_index' in $$props) $$invalidate(1, selected_index = $$props.selected_index); 1363 if ('interactive' in $$props) $$invalidate(12, interactive = $$props.interactive); 1364 }; 1365 1366 $$self.$$.update = () => { 1367 if ($$self.$$.dirty[0] & /*value, was_reset*/ 33554433) { 1368 $$invalidate(25, was_reset = value == null || value.length === 0 ? true : was_reset); 1369 } 1370 1371 if ($$self.$$.dirty[0] & /*value, root, proxy_url*/ 12582913) { 1372 $$invalidate(13, resolved_value = value == null 1373 ? null 1374 : value.map(data => ({ 1375 image: normalise_file(data.image, root, proxy_url), 1376 caption: data.caption 1377 }))); 1378 } 1379 1380 if ($$self.$$.dirty[0] & /*prev_value, value, was_reset, preview, selected_index*/ 117440515) { 1381 if (!dequal(prev_value, value)) { 1382 // When value is falsy (clear button or first load), 1383 // preview determines the selected image 1384 if (was_reset) { 1385 $$invalidate(1, selected_index = preview && value?.length ? 0 : null); 1386 $$invalidate(25, was_reset = false); 1387 } else // gallery has at least as many elements as it did before 1388 { 1389 $$invalidate( 1390 1, 1391 selected_index = selected_index != null && value != null && selected_index < value.length 1392 ? selected_index 1393 : null 1394 ); 1395 } 1396 1397 dispatch("change"); 1398 $$invalidate(26, prev_value = value); 1399 } 1400 } 1401 1402 if ($$self.$$.dirty[0] & /*selected_index, resolved_value*/ 8194) { 1403 previous = ((selected_index ?? 0) + (resolved_value?.length ?? 0) - 1) % (resolved_value?.length ?? 0); 1404 } 1405 1406 if ($$self.$$.dirty[0] & /*selected_index, resolved_value*/ 8194) { 1407 next = ((selected_index ?? 0) + 1) % (resolved_value?.length ?? 0); 1408 } 1409 1410 if ($$self.$$.dirty[0] & /*selected_index, old_selected_index, resolved_value*/ 134225922) { 1411 { 1412 if (selected_index !== old_selected_index) { 1413 $$invalidate(27, old_selected_index = selected_index); 1414 1415 if (selected_index !== null) { 1416 dispatch("select", { 1417 index: selected_index, 1418 value: resolved_value?.[selected_index] 1419 }); 1420 } 1421 } 1422 } 1423 } 1424 1425 if ($$self.$$.dirty[0] & /*allow_preview, selected_index*/ 130) { 1426 if (allow_preview) { 1427 scroll_to_img(selected_index); 1428 } 1429 } 1430 1431 if ($$self.$$.dirty[0] & /*selected_index, resolved_value*/ 8194) { 1432 $$invalidate(18, selected_image = selected_index != null && resolved_value != null 1433 ? resolved_value[selected_index] 1434 : null); 1435 } 1436 }; 1437 1438 return [ 1439 value, 1440 selected_index, 1441 show_label, 1442 label, 1443 columns, 1444 rows, 1445 height, 1446 allow_preview, 1447 object_fit, 1448 show_share_button, 1449 show_download_button, 1450 i18n, 1451 interactive, 1452 resolved_value, 1453 el, 1454 container_element, 1455 client_height, 1456 window_height, 1457 selected_image, 1458 handle_preview_click, 1459 on_keydown, 1460 download, 1461 root, 1462 proxy_url, 1463 preview, 1464 was_reset, 1465 prev_value, 1466 old_selected_index, 1467 onwindowresize, 1468 click_handler, 1469 clear_handler, 1470 click_handler_1, 1471 button_binding, 1472 click_handler_2, 1473 div1_binding, 1474 clear_handler_1, 1475 share_handler, 1476 error_handler, 1477 click_handler_3, 1478 div1_elementresize_handler 1479 ]; 1480} 1481 1482class Gallery extends SvelteComponent$1 { 1483 constructor(options) { 1484 super(); 1485 1486 init$1( 1487 this, 1488 options, 1489 instance$1, 1490 create_fragment$1, 1491 safe_not_equal$1, 1492 { 1493 show_label: 2, 1494 label: 3, 1495 root: 22, 1496 proxy_url: 23, 1497 value: 0, 1498 columns: 4, 1499 rows: 5, 1500 height: 6, 1501 preview: 24, 1502 allow_preview: 7, 1503 object_fit: 8, 1504 show_share_button: 9, 1505 show_download_button: 10, 1506 i18n: 11, 1507 selected_index: 1, 1508 interactive: 12 1509 }, 1510 null, 1511 [-1, -1] 1512 ); 1513 } 1514} 1515 1516const Gallery$1 = Gallery; 1517 1518/* home/runner/work/gradio/gradio/js/gallery/Index.svelte generated by Svelte v4.2.2 */ 1519const { 1520 SvelteComponent, 1521 add_flush_callback, 1522 assign, 1523 bind, 1524 binding_callbacks, 1525 check_outros, 1526 create_component, 1527 destroy_component, 1528 detach, 1529 empty, 1530 get_spread_object, 1531 get_spread_update, 1532 group_outros, 1533 init, 1534 insert, 1535 mount_component, 1536 safe_not_equal, 1537 space, 1538 transition_in, 1539 transition_out 1540} = window.__gradio__svelte__internal;const { createEventDispatcher }
1540 = window.__gradio__svelte__internal; 1541function create_else_block(ctx) { 1542 let gallery; 1543 let updating_selected_index; 1544 let updating_value; 1545 let current; 1546 1547 function gallery_selected_index_binding(value) { 1548 /*gallery_selected_index_binding*/ ctx[25](value); 1549 } 1550 1551 function gallery_value_binding(value) { 1552 /*gallery_value_binding*/ ctx[26](value); 1553 } 1554 1555 let gallery_props = { 1556 label: /*label*/ ctx[4], 1557 show_label: /*show_label*/ ctx[3], 1558 root: /*root*/ ctx[5], 1559 proxy_url: /*proxy_url*/ ctx[6], 1560 columns: /*columns*/ ctx[13], 1561 rows: /*rows*/ ctx[14], 1562 height: /*height*/ ctx[15], 1563 preview: /*preview*/ ctx[16], 1564 object_fit: /*object_fit*/ ctx[18], 1565 interactive: /*interactive*/ ctx[20], 1566 allow_preview: /*allow_preview*/ ctx[17], 1567 show_share_button: /*show_share_button*/ ctx[19], 1568 show_download_button: /*show_download_button*/ ctx[21], 1569 i18n: /*gradio*/ ctx[22].i18n 1570 }; 1571 1572 if (/*selected_index*/ ctx[1] !== void 0) { 1573 gallery_props.selected_index = /*selected_index*/ ctx[1]; 1574 } 1575 1576 if (/*value*/ ctx[0] !== void 0) { 1577 gallery_props.value = /*value*/ ctx[0]; 1578 } 1579 1580 gallery = new Gallery$1({ props: gallery_props }); 1581 binding_callbacks.push(() => bind(gallery, 'selected_index', gallery_selected_index_binding)); 1582 binding_callbacks.push(() => bind(gallery, 'value', gallery_value_binding)); 1583 gallery.$on("change", /*change_handler*/ ctx[27]); 1584 gallery.$on("select", /*select_handler*/ ctx[28]); 1585 gallery.$on("share", /*share_handler*/ ctx[29]); 1586 gallery.$on("error", /*error_handler*/ ctx[30]); 1587 1588 return { 1589 c() { 1590 create_component(gallery.$$.fragment); 1591 }, 1592 m(target, anchor) { 1593 mount_component(gallery, target, anchor); 1594 current = true; 1595 }, 1596 p(ctx, dirty) { 1597 const gallery_changes = {}; 1598 if (dirty[0] & /*label*/ 16) gallery_changes.label = /*label*/ ctx[4]; 1599 if (dirty[0] & /*show_label*/ 8) gallery_changes.show_label = /*show_label*/ ctx[3]; 1600 if (dirty[0] & /*root*/ 32) gallery_changes.root = /*root*/ ctx[5]; 1601 if (dirty[0] & /*proxy_url*/ 64) gallery_changes.proxy_url = /*proxy_url*/ ctx[6]; 1602 if (dirty[0] & /*columns*/ 8192) gallery_changes.columns = /*columns*/ ctx[13]; 1603 if (dirty[0] & /*rows*/ 16384) gallery_changes.rows = /*rows*/ ctx[14]; 1604 if (dirty[0] & /*height*/ 32768) gallery_changes.height = /*height*/ ctx[15]; 1605 if (dirty[0] & /*preview*/ 65536) gallery_changes.preview = /*preview*/ ctx[16]; 1606 if (dirty[0] & /*object_fit*/ 262144) gallery_changes.object_fit = /*object_fit*/ ctx[18]; 1607 if (dirty[0] & /*interactive*/ 1048576) gallery_changes.interactive = /*interactive*/ ctx[20]; 1608 if (dirty[0] & /*allow_preview*/ 131072) gallery_changes.allow_preview = /*allow_preview*/ ctx[17]; 1609 if (dirty[0] & /*show_share_button*/ 524288) gallery_changes.show_share_button = /*show_share_button*/ ctx[19]; 1610 if (dirty[0] & /*show_download_button*/ 2097152) gallery_changes.show_download_button = /*show_download_button*/ ctx[21]; 1611 if (dirty[0] & /*gradio*/ 4194304) gallery_changes.i18n = /*gradio*/ ctx[22].i18n; 1612 1613 if (!updating_selected_index && dirty[0] & /*selected_index*/ 2) { 1614 updating_selected_index = true; 1615 gallery_changes.selected_index = /*selected_index*/ ctx[1]; 1616 add_flush_callback(() => updating_selected_index = false); 1617 } 1618 1619 if (!updating_value && dirty[0] & /*value*/ 1) { 1620 updating_value = true; 1621 gallery_changes.value = /*value*/ ctx[0]; 1622 add_flush_callback(() => updating_value = false); 1623 } 1624 1625 gallery.$set(gallery_changes); 1626 }, 1627 i(local) { 1628 if (current) return; 1629 transition_in(gallery.$$.fragment, local); 1630 current = true; 1631 }, 1632 o(local) { 1633 transition_out(gallery.$$.fragment, local); 1634 current = false; 1635 }, 1636 d(detaching) { 1637 destroy_component(gallery, detaching); 1638 } 1639 }; 1640} 1641 1642// (54:1) {#if interactive && no_value} 1643function create_if_block(ctx) { 1644 let basefileupload; 1645 let current; 1646 1647 basefileupload = new BaseFileUpload({ 1648 props: { 1649 value: null, 1650 root: /*root*/ ctx[5], 1651 label: /*label*/ ctx[4], 1652 file_count: "multiple", 1653 file_types: ["image"], 1654 i18n: /*gradio*/ ctx[22].i18n, 1655 $$slots: { default: [create_default_slot_1] }, 1656 $$scope: { ctx } 1657 } 1658 }); 1659 1660 basefileupload.$on("upload", /*upload_handler*/ ctx[24]); 1661 1662 return { 1663 c() { 1664 create_component(basefileupload.$$.fragment); 1665 }, 1666 m(target, anchor) { 1667 mount_component(basefileupload, target, anchor); 1668 current = true; 1669 }, 1670 p(ctx, dirty) { 1671 const basefileupload_changes = {};
1672 if (dirty[0] & /*root*/ 32) basefileupload_changes.root = /*root*/ ctx[5]; 1673 if (dirty[0] & /*label*/ 16) basefileupload_changes.label = /*label*/ ctx[4]; 1674 if (dirty[0] & /*gradio*/ 4194304) basefileupload_changes.i18n = /*gradio*/ ctx[22].i18n; 1675 1676 if (dirty[0] & /*gradio*/ 4194304 | dirty[1] & /*$$scope*/ 2) { 1677 basefileupload_changes.$$scope = { dirty, ctx }; 1678 } 1679 1680 basefileupload.$set(basefileupload_changes); 1681 }, 1682 i(local) { 1683 if (current) return; 1684 transition_in(basefileupload.$$.fragment, local); 1685 current = true; 1686 }, 1687 o(local) { 1688 transition_out(basefileupload.$$.fragment, local); 1689 current = false; 1690 }, 1691 d(detaching) { 1692 destroy_component(basefileupload, detaching); 1693 } 1694 }; 1695} 1696 1697// (55:2) <BaseFileUpload value={null} {root} {label} file_count={"multiple"} file_types={["image"]} i18n={gradio.i18n} on:upload={(e) => { const files = Array.isArray(e.detail) ? e.detail : [e.detail]; value = files.map((x) => ({ image: x, caption: null })); gradio.dispatch("upload", value); }} > 1698function create_default_slot_1(ctx) { 1699 let uploadtext; 1700 let current; 1701 1702 uploadtext = new UploadText({ 1703 props: { 1704 i18n: /*gradio*/ ctx[22].i18n, 1705 type: "gallery" 1706 } 1707 }); 1708 1709 return { 1710 c() { 1711 create_component(uploadtext.$$.fragment); 1712 }, 1713 m(target, anchor) { 1714 mount_component(uploadtext, target, anchor); 1715 current = true; 1716 }, 1717 p(ctx, dirty) { 1718 const uploadtext_changes = {}; 1719 if (dirty[0] & /*gradio*/ 4194304) uploadtext_changes.i18n = /*gradio*/ ctx[22].i18n; 1720 uploadtext.$set(uploadtext_changes); 1721 }, 1722 i(local) { 1723 if (current) return; 1724 transition_in(uploadtext.$$.fragment, local); 1725 current = true; 1726 }, 1727 o(local) { 1728 transition_out(uploadtext.$$.fragment, local); 1729 current = false; 1730 }, 1731 d(detaching) { 1732 destroy_component(uploadtext, detaching); 1733 } 1734 }; 1735} 1736 1737// (37:0) <Block {visible} variant="solid" padding={false} {elem_id} {elem_classes} {container} {scale} {min_width} allow_overflow={false} height={typeof height === "number" ? height : undefined} > 1738function create_default_slot(ctx) { 1739 let statustracker; 1740 let t; 1741 let current_block_type_index; 1742 let if_block; 1743 let if_block_anchor; 1744 let current; 1745 1746 const statustracker_spread_levels = [ 1747 { 1748 autoscroll: /*gradio*/ ctx[22].autoscroll 1749 }, 1750 { i18n: /*gradio*/ ctx[22].i18n }, 1751 /*loading_status*/ ctx[2] 1752 ]; 1753 1754 let statustracker_props = {}; 1755 1756 for (let i = 0; i < statustracker_spread_levels.length; i += 1) { 1757 statustracker_props = assign(statustracker_props, statustracker_spread_levels[i]); 1758 } 1759 1760 statustracker = new Static({ props: statustracker_props }); 1761 const if_block_creators = [create_if_block, create_else_block]; 1762 const if_blocks = []; 1763 1764 function select_block_type(ctx, dirty) { 1765 if (/*interactive*/ ctx[20] && /*no_value*/ ctx[23]) return 0; 1766 return 1; 1767 } 1768 1769 current_block_type_index = select_block_type(ctx); 1770 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 1771 1772 return { 1773 c() { 1774 create_component(statustracker.$$.fragment); 1775 t = space(); 1776 if_block.c(); 1777 if_block_anchor = empty(); 1778 }, 1779 m(target, anchor) { 1780 mount_component(statustracker, target, anchor); 1781 insert(target, t, anchor); 1782 if_blocks[current_block_type_index].m(target, anchor); 1783 insert(target, if_block_anchor, anchor); 1784 current = true; 1785 }, 1786 p(ctx, dirty) { 1787 const statustracker_changes = (dirty[0] & /*gradio, loading_status*/ 4194308) 1788 ? get_spread_update(statustracker_spread_levels, [ 1789 dirty[0] & /*gradio*/ 4194304 && { 1790 autoscroll: /*gradio*/ ctx[22].autoscroll 1791 }, 1792 dirty[0] & /*gradio*/ 4194304 && { i18n: /*gradio*/ ctx[22].i18n }, 1793 dirty[0] & /*loading_status*/ 4 && get_spread_object(/*loading_status*/ ctx[2]) 1794 ]) 1795 : {}; 1796 1797 statustracker.$set(statustracker_changes); 1798 let previous_block_index = current_block_type_index; 1799 current_block_type_index = select_block_type(ctx); 1800 1801 if (current_block_type_index === previous_block_index) { 1802 if_blocks[current_block_type_index].p(ctx, dirty); 1803 } else { 1804 group_outros(); 1805 1806 transition_out(if_blocks[previous_block_index], 1, 1, () => { 1807 if_blocks[previous_block_index] = null; 1808 }); 1809 1810 check_outros(); 1811 if_block = if_blocks[current_block_type_index]; 1812 1813 if (!if_block) { 1814 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 1815 if_block.c(); 1816 } else { 1817 if_block.p(ctx, dirty); 1818 } 1819 1820 transition_in(if_block, 1); 1821 if_block.m(if_block_anchor.parentNode, if_block_anchor); 1822 } 1823 }, 1824 i(local) { 1825 if (current) return; 1826 transition_in(statustracker.$$.fragment, local); 1827 transition_in(if_block); 1828 current = true; 1829 }, 1830 o(local) { 1831 transition_out(statustracker.$$.fragment, local); 1832 transition_out(if_block); 1833 current = false;
1834 }, 1835 d(detaching) { 1836 if (detaching) { 1837 detach(t); 1838 detach(if_block_anchor); 1839 } 1840 1841 destroy_component(statustracker, detaching); 1842 if_blocks[current_block_type_index].d(detaching); 1843 } 1844 }; 1845} 1846 1847function create_fragment(ctx) { 1848 let block; 1849 let current; 1850 1851 block = new Block({ 1852 props: { 1853 visible: /*visible*/ ctx[9], 1854 variant: "solid", 1855 padding: false, 1856 elem_id: /*elem_id*/ ctx[7], 1857 elem_classes: /*elem_classes*/ ctx[8], 1858 container: /*container*/ ctx[10], 1859 scale: /*scale*/ ctx[11], 1860 min_width: /*min_width*/ ctx[12], 1861 allow_overflow: false, 1862 height: typeof /*height*/ ctx[15] === "number" 1863 ? /*height*/ ctx[15] 1864 : undefined, 1865 $$slots: { default: [create_default_slot] }, 1866 $$scope: { ctx } 1867 } 1868 }); 1869 1870 return { 1871 c() { 1872 create_component(block.$$.fragment); 1873 }, 1874 m(target, anchor) { 1875 mount_component(block, target, anchor); 1876 current = true; 1877 }, 1878 p(ctx, dirty) { 1879 const block_changes = {}; 1880 if (dirty[0] & /*visible*/ 512) block_changes.visible = /*visible*/ ctx[9]; 1881 if (dirty[0] & /*elem_id*/ 128) block_changes.elem_id = /*elem_id*/ ctx[7]; 1882 if (dirty[0] & /*elem_classes*/ 256) block_changes.elem_classes = /*elem_classes*/ ctx[8]; 1883 if (dirty[0] & /*container*/ 1024) block_changes.container = /*container*/ ctx[10]; 1884 if (dirty[0] & /*scale*/ 2048) block_changes.scale = /*scale*/ ctx[11]; 1885 if (dirty[0] & /*min_width*/ 4096) block_changes.min_width = /*min_width*/ ctx[12]; 1886 1887 if (dirty[0] & /*height*/ 32768) block_changes.height = typeof /*height*/ ctx[15] === "number" 1888 ? /*height*/ ctx[15] 1889 : undefined; 1890 1891 if (dirty[0] & /*root, label, gradio, value, interactive, no_value, show_label, proxy_url, columns, rows, height, preview, object_fit, allow_preview, show_share_button, show_download_button, selected_index, loading_status*/ 16769151 | dirty[1] & /*$$scope*/ 2) { 1892 block_changes.$$scope = { dirty, ctx }; 1893 } 1894 1895 block.$set(block_changes); 1896 }, 1897 i(local) { 1898 if (current) return; 1899 transition_in(block.$$.fragment, local); 1900 current = true; 1901 }, 1902 o(local) { 1903 transition_out(block.$$.fragment, local); 1904 current = false; 1905 }, 1906 d(detaching) { 1907 destroy_component(block, detaching); 1908 } 1909 }; 1910} 1911 1912function instance($$self, $$props, $$invalidate) { 1913 let no_value; 1914 let { loading_status } = $$props; 1915 let { show_label } = $$props; 1916 let { label } = $$props; 1917 let { root } = $$props; 1918 let { proxy_url } = $$props; 1919 let { elem_id = "" } = $$props; 1920 let { elem_classes = [] } = $$props; 1921 let { visible = true } = $$props; 1922 let { value = null } = $$props; 1923 let { container = true } = $$props; 1924 let { scale = null } = $$props; 1925 let { min_width = undefined } = $$props; 1926 let { columns = [2] } = $$props; 1927 let { rows = undefined } = $$props; 1928 let { height = "auto" } = $$props; 1929 let { preview } = $$props; 1930 let { allow_preview = true } = $$props; 1931 let { selected_index = null } = $$props; 1932 let { object_fit = "cover" } = $$props; 1933 let { show_share_button = false } = $$props; 1934 let { interactive } = $$props; 1935 let { show_download_button = false } = $$props; 1936 let { gradio } = $$props; 1937 const dispatch = createEventDispatcher(); 1938 1939 const upload_handler = e => { 1940 const files = Array.isArray(e.detail) ? e.detail : [e.detail]; 1941 $$invalidate(0, value = files.map(x => ({ image: x, caption: null }))); 1942 gradio.dispatch("upload", value); 1943 }; 1944 1945 function gallery_selected_index_binding(value) { 1946 selected_index = value; 1947 $$invalidate(1, selected_index); 1948 } 1949 1950 function gallery_value_binding(value$1) { 1951 value = value$1; 1952 $$invalidate(0, value); 1953 } 1954 1955 const change_handler = () => gradio.dispatch("change", value); 1956 const select_handler = e => gradio.dispatch("select", e.detail); 1957 const share_handler = e => gradio.dispatch("share", e.detail); 1958 const error_handler = e => gradio.dispatch("error", e.detail); 1959 1960 $$self.$$set = $$props => {
1961 if ('loading_status' in $$props) $$invalidate(2, loading_status = $$props.loading_status); 1962 if ('show_label' in $$props) $$invalidate(3, show_label = $$props.show_label); 1963 if ('label' in $$props) $$invalidate(4, label = $$props.label); 1964 if ('root' in $$props) $$invalidate(5, root = $$props.root); 1965 if ('proxy_url' in $$props) $$invalidate(6, proxy_url = $$props.proxy_url); 1966 if ('elem_id' in $$props) $$invalidate(7, elem_id = $$props.elem_id); 1967 if ('elem_classes' in $$props) $$invalidate(8, elem_classes = $$props.elem_classes); 1968 if ('visible' in $$props) $$invalidate(9, visible = $$props.visible); 1969 if ('value' in $$props) $$invalidate(0, value = $$props.value); 1970 if ('container' in $$props) $$invalidate(10, container = $$props.container); 1971 if ('scale' in $$props) $$invalidate(11, scale = $$props.scale); 1972 if ('min_width' in $$props) $$invalidate(12, min_width = $$props.min_width); 1973 if ('columns' in $$props) $$invalidate(13, columns = $$props.columns); 1974 if ('rows' in $$props) $$invalidate(14, rows = $$props.rows);
1975 if ('height' in $$props) $$invalidate(15, height = $$props.height); 1976 if ('preview' in $$props) $$invalidate(16, preview = $$props.preview); 1977 if ('allow_preview' in $$props) $$invalidate(17, allow_preview = $$props.allow_preview); 1978 if ('selected_index' in $$props) $$invalidate(1, selected_index = $$props.selected_index); 1979 if ('object_fit' in $$props) $$invalidate(18, object_fit = $$props.object_fit); 1980 if ('show_share_button' in $$props) $$invalidate(19, show_share_button = $$props.show_share_button); 1981 if ('interactive' in $$props) $$invalidate(20, interactive = $$props.interactive); 1982 if ('show_download_button' in $$props) $$invalidate(21, show_download_button = $$props.show_download_button); 1983 if ('gradio' in $$props) $$invalidate(22, gradio = $$props.gradio); 1984 }; 1985 1986 $$self.$$.update = () => { 1987 if ($$self.$$.dirty[0] & /*value*/ 1) { 1988 $$invalidate(23, no_value = Array.isArray(value) ? value.length === 0 : !value); 1989 } 1990 1991 if ($$self.$$.dirty[0] & /*selected_index*/ 2) { 1992 (dispatch("prop_change", { selected_index })); 1993 } 1994 }; 1995 1996 return [ 1997 value, 1998 selected_index, 1999 loading_status, 2000 show_label, 2001 label, 2002 root, 2003 proxy_url, 2004 elem_id, 2005 elem_classes, 2006 visible, 2007 container, 2008 scale, 2009 min_width, 2010 columns, 2011 rows, 2012 height, 2013 preview, 2014 allow_preview, 2015 object_fit, 2016 show_share_button, 2017 interactive, 2018 show_download_button, 2019 gradio, 2020 no_value, 2021 upload_handler, 2022 gallery_selected_index_binding, 2023 gallery_value_binding, 2024 change_handler, 2025 select_handler, 2026 share_handler, 2027 error_handler 2028 ]; 2029} 2030 2031class Index extends SvelteComponent { 2032 constructor(options) { 2033 super(); 2034 2035 init( 2036 this, 2037 options, 2038 instance, 2039 create_fragment, 2040 safe_not_equal, 2041 { 2042 loading_status: 2, 2043 show_label: 3, 2044 label: 4, 2045 root: 5, 2046 proxy_url: 6, 2047 elem_id: 7, 2048 elem_classes: 8, 2049 visible: 9, 2050 value: 0, 2051 container: 10, 2052 scale: 11, 2053 min_width: 12, 2054 columns: 13, 2055 rows: 14, 2056 height: 15, 2057 preview: 16, 2058 allow_preview: 17, 2059 selected_index: 1, 2060 object_fit: 18, 2061 show_share_button: 19, 2062 interactive: 20, 2063 show_download_button: 21, 2064 gradio: 22 2065 }, 2066 null, 2067 [-1, -1] 2068 ); 2069 } 2070} 2071 2072export { Gallery$1 as BaseGallery, Index as default }; 2073//# sourceMappingURL=Index-6a44c76f.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.