1import { S as SvelteComponent, i as init, s as safe_not_equal, f as element, b as attr, t as toggle_class, c as insert, a3 as set_input_value, l as listen, e as detach, r as run_all, m as space, n as noop, F as bubble, D as binding_callbacks, h as text, j as set_data, k as empty, a5 as HtmlTag, d as append, J as bind, q as create_component, u as mount_component, G as add_flush_callback, v as transition_in, w as transition_out, x as destroy_component, A as createEventDispatcher, a6 as tick, a as svg_element, y as group_outros, a7 as update_keyed_each, a8 as outro_and_destroy_block, z as check_outros, L as assign, M as StatusTracker, N as get_spread_update, O as get_spread_object } from './index.230aa104.js'; 2import { g as get_styles } from './styles.db46e346.js'; 3import { U as Upload } from './Upload.f4af15c4.js'; 4import { d as dsvFormat } from './dsv.7fe76a93.js'; 5 6var has = Object.prototype.hasOwnProperty; 7 8function dequal(foo, bar) { 9 var ctor, len; 10 if (foo === bar) return true; 11 12 if (foo && bar && (ctor=foo.constructor) === bar.constructor) { 13 if (ctor === Date) return foo.getTime() === bar.getTime(); 14 if (ctor === RegExp) return foo.toString() === bar.toString(); 15 16 if (ctor === Array) { 17 if ((len=foo.length) === bar.length) { 18 while (len-- && dequal(foo[len], bar[len])); 19 } 20 return len === -1; 21 } 22 23 if (!ctor || typeof foo === 'object') { 24 len = 0; 25 for (ctor in foo) { 26 if (has.call(foo, ctor) && ++len && !has.call(bar, ctor)) return false; 27 if (!(ctor in bar) || !dequal(foo[ctor], bar[ctor])) return false; 28 } 29 return Object.keys(bar).length === len; 30 } 31 } 32 33 return foo !== foo && bar !== bar; 34} 35 36/* home/runner/work/gradio/gradio/ui/packages/table/src/EditableCell.svelte generated by Svelte v3.49.0 */ 37 38function create_if_block_1$1(ctx) { 39 let input; 40 let mounted; 41 let dispose; 42 43 return { 44 c() { 45 input = element("input"); 46 attr(input, "class", "absolute outline-none inset-2 bg-transparent border-0 translate-x-px flex-1 "); 47 attr(input, "tabindex", "-1"); 48 toggle_class(input, "translate-x-px", !/*header*/ ctx[3]); 49 toggle_class(input, "font-bold", /*header*/ ctx[3]); 50 }, 51 m(target, anchor) { 52 insert(target, input, anchor); 53 set_input_value(input, /*value*/ ctx[0]); 54 /*input_binding*/ ctx[8](input); 55 56 if (!mounted) { 57 dispose = [ 58 listen(input, "input", /*input_input_handler*/ ctx[7]), 59 listen(input, "keydown", /*keydown_handler*/ ctx[6]), 60 listen(input, "blur", blur_handler) 61 ]; 62 63 mounted = true; 64 } 65 }, 66 p(ctx, dirty) { 67 if (dirty & /*value*/ 1 && input.value !== /*value*/ ctx[0]) { 68 set_input_value(input, /*value*/ ctx[0]); 69 } 70 71 if (dirty & /*header*/ 8) { 72 toggle_class(input, "translate-x-px", !/*header*/ ctx[3]); 73 } 74 75 if (dirty & /*header*/ 8) { 76 toggle_class(input, "font-bold", /*header*/ ctx[3]); 77 } 78 }, 79 d(detaching) { 80 if (detaching) detach(input); 81 /*input_binding*/ ctx[8](null); 82 mounted = false; 83 run_all(dispose); 84 } 85 }; 86} 87 88// (31:1) {:else} 89function create_else_block(ctx) { 90 let t; 91 92 return { 93 c() { 94 t = text(/*value*/ ctx[0]); 95 }, 96 m(target, anchor) { 97 insert(target, t, anchor); 98 }, 99 p(ctx, dirty) { 100 if (dirty & /*value*/ 1) set_data(t, /*value*/ ctx[0]); 101 }, 102 d(detaching) { 103 if (detaching) detach(t); 104 } 105 }; 106} 107 108// (29:1) {#if datatype === "markdown" || datatype === "html"} 109function create_if_block$1(ctx) { 110 let html_tag; 111 let html_anchor; 112 113 return { 114 c() { 115 html_tag = new HtmlTag(false); 116 html_anchor = empty(); 117 html_tag.a = html_anchor; 118 }, 119 m(target, anchor) { 120 html_tag.m(/*value*/ ctx[0], target, anchor); 121 insert(target, html_anchor, anchor); 122 }, 123 p(ctx, dirty) { 124 if (dirty & /*value*/ 1) html_tag.p(/*value*/ ctx[0]); 125 }, 126 d(detaching) { 127 if (detaching) detach(html_anchor); 128 if (detaching) html_tag.d(); 129 } 130 }; 131} 132 133function create_fragment$2(ctx) { 134 let t; 135 let span; 136 let mounted; 137 let dispose; 138 let if_block0 = /*edit*/ ctx[2] && create_if_block_1$1(ctx); 139 140 function select_block_type(ctx, dirty) { 141 if (/*datatype*/ ctx[4] === "markdown" || /*datatype*/ ctx[4] === "html") return create_if_block$1; 142 return create_else_block; 143 } 144 145 let current_block_type = select_block_type(ctx); 146 let if_block1 = current_block_type(ctx); 147 148 return { 149 c() { 150 if (if_block0) if_block0.c(); 151 t = space(); 152 span = element("span"); 153 if_block1.c(); 154 attr(span, "tabindex", "-1"); 155 attr(span, "role", "button"); 156 attr(span, "class", "p-2 outline-none border-0 flex-1"); 157 toggle_class(span, "opacity-0", /*edit*/ ctx[2]); 158 toggle_class(span, "pointer-events-none", /*edit*/ ctx[2]); 159 }, 160 m(target, anchor) { 161 if (if_block0) if_block0.m(target, anchor); 162 insert(target, t, anchor); 163 insert(target, span, anchor); 164 if_block1.m(span, null); 165 166 if (!mounted) { 167 dispose = listen(span, "dblclick", /*dblclick_handler*/ ctx[5]); 168 mounted = true; 169 } 170 }, 171 p(ctx, [dirty]) { 172 if (/*edit*/ ctx[2]) { 173 if (if_block0) { 174 if_block0.p(ctx, dirty); 175 } else { 176 if_block0 = create_if_block_1$1(ctx); 177 if_block0.c(); 178 if_block0.m(t.parentNode, t); 179 } 180 } else if (if_block0) { 181 if_block0.d(1); 182 if_block0 = null; 183 } 184 185 if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block1) { 186 if_block1.p(ctx, dirty); 187 } else { 188 if_block1.d(1); 189 if_block1 = current_block_type(ctx); 190 191 if (if_block1) { 192 if_block1.c(); 193 if_block1.m(span, null); 194 } 195 } 196
197 if (dirty & /*edit*/ 4) { 198 toggle_class(span, "opacity-0", /*edit*/ ctx[2]); 199 } 200 201 if (dirty & /*edit*/ 4) { 202 toggle_class(span, "pointer-events-none", /*edit*/ ctx[2]); 203 } 204 }, 205 i: noop, 206 o: noop, 207 d(detaching) { 208 if (if_block0) if_block0.d(detaching); 209 if (detaching) detach(t); 210 if (detaching) detach(span); 211 if_block1.d(); 212 mounted = false; 213 dispose(); 214 } 215 }; 216} 217 218const blur_handler = ({ currentTarget }) => currentTarget.setAttribute("tabindex", "-1"); 219 220function instance$2($$self, $$props, $$invalidate) { 221 let { edit } = $$props; 222 let { value = "" } = $$props; 223 let { el } = $$props; 224 let { header = false } = $$props; 225 let { datatype = "str" } = $$props; 226 227 function dblclick_handler(event) { 228 bubble.call(this, $$self, event); 229 } 230 231 function keydown_handler(event) { 232 bubble.call(this, $$self, event); 233 } 234 235 function input_input_handler() { 236 value = this.value; 237 $$invalidate(0, value); 238 } 239 240 function input_binding($$value) { 241 binding_callbacks[$$value ? 'unshift' : 'push'](() => { 242 el = $$value; 243 $$invalidate(1, el); 244 }); 245 } 246 247 $$self.$$set = $$props => {
248 if ('edit' in $$props) $$invalidate(2, edit = $$props.edit); 249 if ('value' in $$props) $$invalidate(0, value = $$props.value); 250 if ('el' in $$props) $$invalidate(1, el = $$props.el); 251 if ('header' in $$props) $$invalidate(3, header = $$props.header); 252 if ('datatype' in $$props) $$invalidate(4, datatype = $$props.datatype); 253 }; 254 255 return [ 256 value, 257 el, 258 edit, 259 header, 260 datatype, 261 dblclick_handler, 262 keydown_handler, 263 input_input_handler, 264 input_binding 265 ]; 266} 267 268class EditableCell extends SvelteComponent { 269 constructor(options) { 270 super(); 271 272 init(this, options, instance$2, create_fragment$2, safe_not_equal, { 273 edit: 2, 274 value: 0, 275 el: 1, 276 header: 3, 277 datatype: 4 278 }); 279 } 280} 281 282/* home/runner/work/gradio/gradio/ui/packages/table/src/Table.svelte generated by Svelte v3.49.0 */ 283 284function get_each_context(ctx, list, i) { 285 const child_ctx = ctx.slice(); 286 child_ctx[53] = list[i]; 287 child_ctx[55] = i; 288 return child_ctx; 289} 290 291function get_each_context_1(ctx, list, i) { 292 const child_ctx = ctx.slice(); 293 child_ctx[56] = list[i].value; 294 child_ctx[57] = list[i].id; 295 child_ctx[58] = list; 296 child_ctx[59] = i; 297 return child_ctx; 298} 299 300function get_each_context_2(ctx, list, i) { 301 const child_ctx = ctx.slice(); 302 child_ctx[56] = list[i].value; 303 child_ctx[57] = list[i].id; 304 child_ctx[60] = list; 305 child_ctx[55] = i; 306 return child_ctx; 307} 308 309// (399:1) {#if label && label.length !== 0} 310function create_if_block_4(ctx) { 311 let p; 312 let t; 313 314 return { 315 c() { 316 p = element("p"); 317 t = text(/*label*/ ctx[1]); 318 attr(p, "class", "text-gray-600 text-[0.855rem] mb-2 block dark:text-gray-200 relative z-40"); 319 }, 320 m(target, anchor) { 321 insert(target, p, anchor); 322 append(p, t); 323 }, 324 p(ctx, dirty) { 325 if (dirty[0] & /*label*/ 2) set_data(t, /*label*/ ctx[1]); 326 }, 327 d(detaching) { 328 if (detaching) detach(p); 329 } 330 }; 331} 332 333// (423:4) {#if label && label.length !== 0} 334function create_if_block_3(ctx) { 335 let caption; 336 let t; 337 338 return { 339 c() { 340 caption = element("caption"); 341 t = text(/*label*/ ctx[1]); 342 attr(caption, "class", "sr-only"); 343 }, 344 m(target, anchor) { 345 insert(target, caption, anchor); 346 append(caption, t); 347 }, 348 p(ctx, dirty) { 349 if (dirty[0] & /*label*/ 2) set_data(t, /*label*/ ctx[1]); 350 }, 351 d(detaching) { 352 if (detaching) detach(caption); 353 } 354 }; 355} 356 357// (430:6) {#each _headers as { value, id } 358function create_each_block_2(key_1, ctx) { 359 let th; 360 let div1; 361 let editablecell; 362 let updating_el; 363 let t0; 364 let div0; 365 let svg; 366 let path; 367 let div0_class_value; 368 let t1; 369 let th_class_value; 370 let th_aria_sort_value; 371 let id = /*id*/ ctx[57]; 372 let current; 373 let mounted; 374 let dispose; 375 376 function editablecell_el_binding(value) { 377 /*editablecell_el_binding*/ ctx[32](value, /*id*/ ctx[57]); 378 } 379 380 function dblclick_handler() { 381 return /*dblclick_handler*/ ctx[33](/*id*/ ctx[57]); 382 } 383 384 let editablecell_props = { 385 value: /*value*/ ctx[56], 386 edit: /*header_edit*/ ctx[13] === /*id*/ ctx[57], 387 header: true 388 }; 389 390 if (/*els*/ ctx[10][/*id*/ ctx[57]].input !== void 0) { 391 editablecell_props.el = /*els*/ ctx[10][/*id*/ ctx[57]].input; 392 } 393 394 editablecell = new EditableCell({ props: editablecell_props }); 395 binding_callbacks.push(() => bind(editablecell, 'el', editablecell_el_binding)); 396 editablecell.$on("keydown", /*end_header_edit*/ ctx[22]); 397 editablecell.$on("dblclick", dblclick_handler); 398 399 function click_handler() { 400 return /*click_handler*/ ctx[34](/*i*/ ctx[55]); 401 } 402 403 const assign_th = () => /*th_binding*/ ctx[35](th, id); 404 const unassign_th = () => /*th_binding*/ ctx[35](null, id); 405 406 return { 407 key: key_1, 408 first: null, 409 c() { 410 th = element("th"); 411 div1 = element("div"); 412 create_component(editablecell.$$.fragment); 413 t0 = space(); 414 div0 = element("div"); 415 svg = svg_element("svg"); 416 path = svg_element("path"); 417 t1 = space(); 418 attr(path, "d", "M4.49999 0L8.3971 6.75H0.602875L4.49999 0Z"); 419 attr(svg, "width", "1em"); 420 attr(svg, "height", "1em"); 421 attr(svg, "class", "fill-current text-[10px]"); 422 attr(svg, "viewBox", "0 0 9 7"); 423 attr(svg, "fill", "none"); 424 attr(svg, "xmlns", "http://www.w3.org/2000/svg"); 425 426 attr(div0, "class", div0_class_value = "flex flex-none items-center justify-center p-2 cursor-pointer leading-snug transform transition-all " + (/*sort_by*/ ctx[12] !== /*i*/ ctx[55] 427 ? 'text-gray-200 hover:text-gray-500' 428 : 'text-orange-500') + " " + (/*sort_by*/ ctx[12] === /*i*/ ctx[55] && /*sort_direction*/ ctx[11] === 'des' 429 ? '-scale-y-[1]' 430 : '')); 431 432 toggle_class(div0, "text-gray-200", /*sort_by*/ ctx[12] !== /*i*/ ctx[55]); 433 attr(div1, "class", "min-h-[2.3rem] flex outline-none"); 434 attr(th, "class", th_class_value = "p-0 relative focus-within:ring-1 ring-orange-500 ring-inset outline-none " + /*classes*/ ctx[15]); 435 attr(th, "aria-sort", th_aria_sort_value = /*get_sort_status*/ ctx[16](/*value*/ ctx[56], /*sort_by*/ ctx[12], /*sort_direction*/ ctx[11])); 436 toggle_class(th, "bg-orange-50", /*header_edit*/ ctx[13] === /*id*/ ctx[57]); 437 toggle_class(th, "dark:bg-transparent", /*header_edit*/ ctx[13] === /*id*/ ctx[57]); 438 toggle_class(th, "rounded-tl-lg", /*i*/ ctx[55] === 0); 439 toggle_class(th, "rounded-tr-lg", /*i*/ ctx[55] === /*_headers*/ ctx[8].length - 1); 440 this.first = th; 441 }, 442 m(target, anchor) { 443 insert(target, th, anchor); 444 append(th, div1);
445 mount_component(editablecell, div1, null); 446 append(div1, t0); 447 append(div1, div0); 448 append(div0, svg); 449 append(svg, path); 450 append(th, t1); 451 assign_th(); 452 current = true; 453 454 if (!mounted) { 455 dispose = listen(div0, "click", click_handler); 456 mounted = true; 457 } 458 }, 459 p(new_ctx, dirty) { 460 ctx = new_ctx; 461 const editablecell_changes = {}; 462 if (dirty[0] & /*_headers*/ 256) editablecell_changes.value = /*value*/ ctx[56]; 463 if (dirty[0] & /*header_edit, _headers*/ 8448) editablecell_changes.edit = /*header_edit*/ ctx[13] === /*id*/ ctx[57]; 464 465 if (!updating_el && dirty[0] & /*els, _headers*/ 1280) { 466 updating_el = true; 467 editablecell_changes.el = /*els*/ ctx[10][/*id*/ ctx[57]].input; 468 add_flush_callback(() => updating_el = false); 469 } 470 471 editablecell.$set(editablecell_changes); 472 473 if (!current || dirty[0] & /*sort_by, _headers, sort_direction*/ 6400 && div0_class_value !== (div0_class_value = "flex flex-none items-center justify-center p-2 cursor-pointer leading-snug transform transition-all " + (/*sort_by*/ ctx[12] !== /*i*/ ctx[55] 474 ? 'text-gray-200 hover:text-gray-500' 475 : 'text-orange-500') + " " + (/*sort_by*/ ctx[12] === /*i*/ ctx[55] && /*sort_direction*/ ctx[11] === 'des' 476 ? '-scale-y-[1]' 477 : ''))) { 478 attr(div0, "class", div0_class_value); 479 } 480 481 if (dirty[0] & /*sort_by, _headers, sort_direction, sort_by, _headers*/ 6400) { 482 toggle_class(div0, "text-gray-200", /*sort_by*/ ctx[12] !== /*i*/ ctx[55]); 483 } 484 485 if (!current || dirty[0] & /*classes*/ 32768 && th_class_value !== (th_class_value = "p-0 relative focus-within:ring-1 ring-orange-500 ring-inset outline-none " + /*classes*/ ctx[15])) { 486 attr(th, "class", th_class_value); 487 } 488 489 if (!current || dirty[0] & /*_headers, sort_by, sort_direction*/ 6400 && th_aria_sort_value !== (th_aria_sort_value = /*get_sort_status*/ ctx[16](/*value*/ ctx[56], /*sort_by*/ ctx[12], /*sort_direction*/ ctx[11]))) { 490 attr(th, "aria-sort", th_aria_sort_value); 491 } 492 493 if (id !== /*id*/ ctx[57]) { 494 unassign_th(); 495 id = /*id*/ ctx[57]; 496 assign_th(); 497 } 498 499 if (dirty[0] & /*classes, header_edit, _headers*/ 41216) { 500 toggle_class(th, "bg-orange-50", /*header_edit*/ ctx[13] === /*id*/ ctx[57]); 501 } 502 503 if (dirty[0] & /*classes, header_edit, _headers*/ 41216) { 504 toggle_class(th, "dark:bg-transparent", /*header_edit*/ ctx[13] === /*id*/ ctx[57]); 505 } 506 507 if (dirty[0] & /*classes, _headers*/ 33024) { 508 toggle_class(th, "rounded-tl-lg", /*i*/ ctx[55] === 0); 509 } 510 511 if (dirty[0] & /*classes, _headers*/ 33024) { 512 toggle_class(th, "rounded-tr-lg", /*i*/ ctx[55] === /*_headers*/ ctx[8].length - 1); 513 } 514 }, 515 i(local) { 516 if (current) return; 517 transition_in(editablecell.$$.fragment, local); 518 current = true; 519 }, 520 o(local) { 521 transition_out(editablecell.$$.fragment, local); 522 current = false; 523 }, 524 d(detaching) { 525 if (detaching) detach(th); 526 destroy_component(editablecell); 527 unassign_th(); 528 mounted = false; 529 dispose(); 530 } 531 }; 532} 533 534// (483:7) {#each row as { value, id } 535function create_each_block_1(key_1, ctx) { 536 let td; 537 let div; 538 let editablecell; 539 let updating_value; 540 let updating_el; 541 let td_class_value; 542 let id = /*id*/ ctx[57]; 543 let current; 544 let mounted; 545 let dispose; 546 547 function editablecell_value_binding(value) { 548 /*editablecell_value_binding*/ ctx[36](value, /*value*/ ctx[56], /*each_value_1*/ ctx[58], /*j*/ ctx[59]); 549 } 550 551 function editablecell_el_binding_1(value) { 552 /*editablecell_el_binding_1*/ ctx[37](value, /*id*/ ctx[57]); 553 } 554 555 let editablecell_props = { 556 edit: /*editing*/ ctx[6] === /*id*/ ctx[57], 557 datatype: Array.isArray(/*datatype*/ ctx[0]) 558 ? /*datatype*/ ctx[0][/*j*/ ctx[59]] 559 : /*datatype*/ ctx[0] 560 }; 561 562 if (/*value*/ ctx[56] !== void 0) { 563 editablecell_props.value = /*value*/ ctx[56]; 564 } 565 566 if (/*els*/ ctx[10][/*id*/ ctx[57]].input !== void 0) { 567 editablecell_props.el = /*els*/ ctx[10][/*id*/ ctx[57]].input; 568 } 569 570 editablecell = new EditableCell({ props: editablecell_props }); 571 binding_callbacks.push(() => bind(editablecell, 'value', editablecell_value_binding)); 572 binding_callbacks.push(() => bind(editablecell, 'el', editablecell_el_binding_1)); 573 const assign_td = () => /*td_binding*/ ctx[38](td, id); 574 const unassign_td = () => /*td_binding*/ ctx[38](null, id); 575 576 function touchstart_handler() { 577 return /*touchstart_handler*/ ctx[39](/*id*/ ctx[57]); 578 } 579 580 function click_handler_1() { 581 return /*click_handler_1*/ ctx[40](/*id*/ ctx[57]); 582 } 583 584 function dblclick_handler_1() { 585 return /*dblclick_handler_1*/ ctx[41](/*id*/ ctx[57]); 586 } 587 588 function keydown_handler(...args) { 589 return /*keydown_handler*/ ctx[42](/*i*/ ctx[55], /*j*/ ctx[59], /*id*/ ctx[57], ...args); 590 } 591 592 return { 593 key: key_1, 594 first: null, 595 c() { 596 td = element("td"); 597 div = element("div"); 598 create_component(editablecell.$$.fragment); 599 attr(div, "class", "min-h-[2.3rem] h-full outline-none flex items-center"); 600 toggle_class(div, "border-transparent", /*selected*/ ctx[7] !== /*id*/ ctx[57]); 601 attr(td, "tabindex", "0"); 602 attr(td, "class", td_class_value = "outline-none focus-within:ring-1 ring-orange-500 ring-inset focus-within:bg-orange-50 dark:focus-within:bg-gray-800 group-last:first:rounded-bl-lg group-last:last:rounded-br-lg relative " + /*classes*/ ctx[15]); 603 this.first = td; 604 }, 605 m(target, anchor) { 606 insert(target, td, anchor); 607 append(td, div);
608 mount_component(editablecell, div, null); 609 assign_td(); 610 current = true; 611 612 if (!mounted) { 613 dispose = [ 614 listen(td, "touchstart", touchstart_handler, { passive: true }), 615 listen(td, "click", click_handler_1), 616 listen(td, "dblclick", dblclick_handler_1), 617 listen(td, "keydown", keydown_handler) 618 ]; 619 620 mounted = true; 621 } 622 }, 623 p(new_ctx, dirty) { 624 ctx = new_ctx; 625 const editablecell_changes = {}; 626 if (dirty[0] & /*editing, data*/ 576) editablecell_changes.edit = /*editing*/ ctx[6] === /*id*/ ctx[57]; 627 628 if (dirty[0] & /*datatype, data*/ 513) editablecell_changes.datatype = Array.isArray(/*datatype*/ ctx[0]) 629 ? /*datatype*/ ctx[0][/*j*/ ctx[59]] 630 : /*datatype*/ ctx[0]; 631 632 if (!updating_value && dirty[0] & /*data*/ 512) { 633 updating_value = true; 634 editablecell_changes.value = /*value*/ ctx[56]; 635 add_flush_callback(() => updating_value = false); 636 } 637 638 if (!updating_el && dirty[0] & /*els, data*/ 1536) { 639 updating_el = true; 640 editablecell_changes.el = /*els*/ ctx[10][/*id*/ ctx[57]].input; 641 add_flush_callback(() => updating_el = false); 642 } 643 644 editablecell.$set(editablecell_changes); 645 646 if (dirty[0] & /*selected, data*/ 640) { 647 toggle_class(div, "border-transparent", /*selected*/ ctx[7] !== /*id*/ ctx[57]); 648 } 649 650 if (!current || dirty[0] & /*classes*/ 32768 && td_class_value !== (td_class_value = "outline-none focus-within:ring-1 ring-orange-500 ring-inset focus-within:bg-orange-50 dark:focus-within:bg-gray-800 group-last:first:rounded-bl-lg group-last:last:rounded-br-lg relative " + /*classes*/ ctx[15])) { 651 attr(td, "class", td_class_value); 652 } 653 654 if (id !== /*id*/ ctx[57]) { 655 unassign_td(); 656 id = /*id*/ ctx[57]; 657 assign_td(); 658 } 659 }, 660 i(local) { 661 if (current) return; 662 transition_in(editablecell.$$.fragment, local); 663 current = true; 664 }, 665 o(local) { 666 transition_out(editablecell.$$.fragment, local); 667 current = false; 668 }, 669 d(detaching) { 670 if (detaching) detach(td); 671 destroy_component(editablecell); 672 unassign_td(); 673 mounted = false; 674 run_all(dispose); 675 } 676 }; 677} 678 679// (479:5) {#each data as row, i (row)} 680function create_each_block(key_1, ctx) { 681 let tr; 682 let each_blocks = []; 683 let each_1_lookup = new Map(); 684 let t; 685 let current; 686 let each_value_1 = /*row*/ ctx[53]; 687 const get_key = ctx => /*id*/ ctx[57]; 688 689 for (let i = 0; i < each_value_1.length; i += 1) { 690 let child_ctx = get_each_context_1(ctx, each_value_1, i); 691 let key = get_key(child_ctx); 692 each_1_lookup.set(key, each_blocks[i] = create_each_block_1(key, child_ctx)); 693 } 694 695 return { 696 key: key_1, 697 first: null, 698 c() { 699 tr = element("tr"); 700 701 for (let i = 0; i < each_blocks.length; i += 1) { 702 each_blocks[i].c(); 703 } 704 705 t = space(); 706 attr(tr, "class", "group border-b dark:border-gray-700 last:border-none divide-x dark:divide-gray-700 space-x-4 odd:bg-gray-50 dark:odd:bg-gray-900 group focus:bg-gradient-to-b focus:from-blue-100 dark:focus:from-blue-900 focus:to-blue-50 dark:focus:to-gray-900 focus:odd:bg-white"); 707 this.first = tr; 708 }, 709 m(target, anchor) { 710 insert(target, tr, anchor); 711 712 for (let i = 0; i < each_blocks.length; i += 1) { 713 each_blocks[i].m(tr, null); 714 } 715 716 append(tr, t); 717 current = true; 718 }, 719 p(new_ctx, dirty) { 720 ctx = new_ctx; 721 722 if (dirty[0] & /*classes, els, data, start_edit, handle_cell_click, handle_keydown, selected, editing, datatype*/ 952001) { 723 each_value_1 = /*row*/ ctx[53]; 724 group_outros(); 725 each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value_1, each_1_lookup, tr, outro_and_destroy_block, create_each_block_1, t, get_each_context_1); 726 check_outros(); 727 } 728 }, 729 i(local) { 730 if (current) return; 731 732 for (let i = 0; i < each_value_1.length; i += 1) { 733 transition_in(each_blocks[i]); 734 } 735 736 current = true; 737 }, 738 o(local) { 739 for (let i = 0; i < each_blocks.length; i += 1) { 740 transition_out(each_blocks[i]); 741 } 742 743 current = false; 744 }, 745 d(detaching) { 746 if (detaching) detach(tr); 747 748 for (let i = 0; i < each_blocks.length; i += 1) { 749 each_blocks[i].d(); 750 } 751 } 752 }; 753} 754 755// (411:2) <Upload flex={false}
755 center={false} boundedheight={false} click={false} on:load={(e) => blob_to_string(data_uri_to_blob(e.detail.data))} bind:dragging > 756function create_default_slot(ctx) { 757 let table; 758 let t0; 759 let thead; 760 let tr; 761 let each_blocks_1 = []; 762 let each0_lookup = new Map(); 763 let t1; 764 let tbody; 765 let each_blocks = []; 766 let each1_lookup = new Map(); 767 let current; 768 let if_block = /*label*/ ctx[1] && /*label*/ ctx[1].length !== 0 && create_if_block_3(ctx); 769 let each_value_2 = /*_headers*/ ctx[8]; 770 const get_key = ctx => /*id*/ ctx[57]; 771 772 for (let i = 0; i < each_value_2.length; i += 1) { 773 let child_ctx = get_each_context_2(ctx, each_value_2, i); 774 let key = get_key(child_ctx); 775 each0_lookup.set(key, each_blocks_1[i] = create_each_block_2(key, child_ctx)); 776 } 777 778 let each_value = /*data*/ ctx[9]; 779 const get_key_1 = ctx => /*row*/ ctx[53]; 780 781 for (let i = 0; i < each_value.length; i += 1) { 782 let child_ctx = get_each_context(ctx, each_value, i); 783 let key = get_key_1(child_ctx); 784 each1_lookup.set(key, each_blocks[i] = create_each_block(key, child_ctx)); 785 } 786 787 return { 788 c() { 789 table = element("table"); 790 if (if_block) if_block.c(); 791 t0 = space(); 792 thead = element("thead"); 793 tr = element("tr"); 794 795 for (let i = 0; i < each_blocks_1.length; i += 1) { 796 each_blocks_1[i].c(); 797 } 798 799 t1 = space(); 800 tbody = element("tbody"); 801 802 for (let i = 0; i < each_blocks.length; i += 1) { 803 each_blocks[i].c(); 804 } 805 806 attr(tr, "class", "border-b dark:border-gray-700 divide-x dark:divide-gray-700 text-left"); 807 attr(thead, "class", "sticky top-0 left-0 right-0 bg-white shadow-sm z-10"); 808 attr(tbody, "class", "overflow-y-scroll"); 809 attr(table, "class", "table-auto font-mono w-full text-gray-900 text-sm transition-opacity overflow-hidden"); 810 toggle_class(table, "opacity-40", /*dragging*/ ctx[14]); 811 }, 812 m(target, anchor) { 813 insert(target, table, anchor); 814 if (if_block) if_block.m(table, null); 815 append(table, t0); 816 append(table, thead); 817 append(thead, tr); 818 819 for (let i = 0; i < each_blocks_1.length; i += 1) { 820 each_blocks_1[i].m(tr, null); 821 } 822 823 append(table, t1); 824 append(table, tbody); 825 826 for (let i = 0; i < each_blocks.length; i += 1) { 827 each_blocks[i].m(tbody, null); 828 } 829 830 current = true; 831 }, 832 p(ctx, dirty) { 833 if (/*label*/ ctx[1] && /*label*/ ctx[1].length !== 0) { 834 if (if_block) { 835 if_block.p(ctx, dirty); 836 } else { 837 if_block = create_if_block_3(ctx); 838 if_block.c(); 839 if_block.m(table, t0); 840 } 841 } else if (if_block) { 842 if_block.d(1); 843 if_block = null; 844 } 845 846 if (dirty[0] & /*classes, get_sort_status, _headers, sort_by, sort_direction, els, header_edit, handle_sort, end_header_edit, edit_header*/ 7453952) { 847 each_value_2 = /*_headers*/ ctx[8]; 848 group_outros(); 849 each_blocks_1 = update_keyed_each(each_blocks_1, dirty, get_key, 1, ctx, each_value_2, each0_lookup, tr, outro_and_destroy_block, create_each_block_2, null, get_each_context_2); 850 check_outros(); 851 } 852 853 if (dirty[0] & /*data, classes, els, start_edit, handle_cell_click, handle_keydown, selected, editing, datatype*/ 952001) { 854 each_value = /*data*/ ctx[9]; 855 group_outros(); 856 each_blocks = update_keyed_each(each_blocks, dirty, get_key_1, 1, ctx, each_value, each1_lookup, tbody, outro_and_destroy_block, create_each_block, null, get_each_context); 857 check_outros(); 858 } 859 860 if (dirty[0] & /*dragging*/ 16384) { 861 toggle_class(table, "opacity-40", /*dragging*/ ctx[14]); 862 } 863 }, 864 i(local) { 865 if (current) return; 866 867 for (let i = 0; i < each_value_2.length; i += 1) { 868 transition_in(each_blocks_1[i]); 869 } 870 871 for (let i = 0; i < each_value.length; i += 1) { 872 transition_in(each_blocks[i]); 873 } 874 875 current = true; 876 }, 877 o(local) { 878 for (let i = 0; i < each_blocks_1.length; i += 1) { 879 transition_out(each_blocks_1[i]); 880 } 881 882 for (let i = 0; i < each_blocks.length; i += 1) { 883 transition_out(each_blocks[i]); 884 } 885 886 current = false; 887 }, 888 d(detaching) { 889 if (detaching) detach(table); 890 if (if_block) if_block.d(); 891 892 for (let i = 0; i < each_blocks_1.length; i += 1) { 893 each_blocks_1[i].d(); 894 } 895 896 for (let i = 0; i < each_blocks.length; i += 1) { 897 each_blocks[i].d(); 898 } 899 } 900 }; 901} 902 903// (514:1) {#if editable} 904function create_if_block(ctx) { 905 let div; 906 let t; 907 let if_block0 = /*row_count*/ ctx[3][1] === "dynamic" && create_if_block_2(ctx); 908 let if_block1 = /*col_count*/ ctx[2][1] === "dynamic" && create_if_block_1(ctx); 909 910 return { 911 c() { 912 div = element("div"); 913 if (if_block0) if_block0.c(); 914 t = space(); 915 if (if_block1) if_block1.c(); 916 attr(div, "class", "flex justify-end space-x-1 pt-2 text-gray-800"); 917 }, 918 m(target, anchor) { 919 insert(target, div, anchor); 920 if (if_block0) if_block0.m(div, null); 921 append(div, t); 922 if (if_block1) if_block1.m(div, null); 923 }, 924 p(ctx, dirty) { 925 if (/*row_count*/ ctx[3][1] === "dynamic") { 926 if (if_block0) { 927 if_block0.p(ctx, dirty); 928 } else { 929 if_block0 = create_if_block_2(ctx); 930 if_block0.c(); 931 if_block0.m(div, t); 932 } 933 } else if (if_block0) { 934 if_block0.d(1); 935 if_block0 = null; 936 } 937 938 if (/*col_count*/ ctx[2][1] === "dynamic") { 939 if (if_block1) { 940 if_block1.p(ctx, dirty); 941 } else { 942 if_block1 = create_if_block_1(ctx); 943 if_block1.c(); 944 if_block1.m(div, null); 945 } 946 } else if (if_block1) { 947 if_block1.d(1); 948 if_block1 = null; 949 } 950 }, 951 d(detaching) { 952 if (detaching) detach(div); 953 if (if_block0) if_block0.d(); 954 if (if_block1) if_block1.d(); 955 } 956 }; 957} 958 959// (516:3) {#if row_count[1] === "dynamic"} 960function create_if_block_2(ctx) { 961 let button; 962 let mounted; 963 let dispose; 964 965 return { 966 c() { 967 button = element("button"); 968 button.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="mr-1 group-hover:text-orange-500" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32">
968<path fill="currentColor" d="M24.59 16.59L17 24.17V4h-2v20.17l-7.59-7.58L6 18l10 10l10-10l-1.41-1.41z"></path></svg>New row`; 969 attr(button, "class", "!flex-none gr-button group"); 970 }, 971 m(target, anchor) { 972 insert(target, button, anchor); 973 974 if (!mounted) { 975 dispose = listen(button, "click", /*click_handler_2*/ ctx[45]); 976 mounted = true; 977 } 978 }, 979 p: noop, 980 d(detaching) { 981 if (detaching) detach(button); 982 mounted = false; 983 dispose(); 984 } 985 }; 986} 987 988// (535:3) {#if col_count[1] === "dynamic"} 989function create_if_block_1(ctx) { 990 let button; 991 let mounted; 992 let dispose; 993 994 return { 995 c() { 996 button = element("button"); 997 998 button.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="mr-1 group-hover:text-orange-500" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path fill="currentColor" d="m18 6l-1.43 1.393L24.15 15H4v2h20.15l-7.58 7.573L18 26l10-10L18 6z"></path></svg> 999 New column`; 1000 1001 attr(button, "class", "!flex-none gr-button group"); 1002 }, 1003 m(target, anchor) { 1004 insert(target, button, anchor); 1005 1006 if (!mounted) { 1007 dispose = listen(button, "click", /*add_col*/ ctx[24]); 1008 mounted = true; 1009 } 1010 }, 1011 p: noop, 1012 d(detaching) { 1013 if (detaching) detach(button); 1014 mounted = false; 1015 dispose(); 1016 } 1017 }; 1018} 1019 1020function create_fragment$1(ctx) { 1021 let div1; 1022 let t0; 1023 let div0; 1024 let upload; 1025 let updating_dragging; 1026 let div0_class_value; 1027 let t1; 1028 let current; 1029 let mounted; 1030 let dispose; 1031 let if_block0 = /*label*/ ctx[1] && /*label*/ ctx[1].length !== 0 && create_if_block_4(ctx); 1032 1033 function upload_dragging_binding(value) { 1034 /*upload_dragging_binding*/ ctx[43](value); 1035 } 1036 1037 let upload_props = { 1038 flex: false, 1039 center: false, 1040 boundedheight: false, 1041 click: false, 1042 $$slots: { default: [create_default_slot] }, 1043 $$scope: { ctx } 1044 }; 1045 1046 if (/*dragging*/ ctx[14] !== void 0) { 1047 upload_props.dragging = /*dragging*/ ctx[14]; 1048 } 1049 1050 upload = new Upload({ props: upload_props }); 1051 binding_callbacks.push(() => bind(upload, 'dragging', upload_dragging_binding)); 1052 upload.$on("load", /*load_handler*/ ctx[44]); 1053 let if_block1 = /*editable*/ ctx[4] && create_if_block(ctx); 1054 1055 return { 1056 c() { 1057 div1 = element("div"); 1058 if (if_block0) if_block0.c(); 1059 t0 = space(); 1060 div0 = element("div"); 1061 create_component(upload.$$.fragment); 1062 t1 = space(); 1063 if (if_block1) if_block1.c(); 1064 attr(div0, "class", div0_class_value = "scroll-hide overflow-hidden rounded-lg relative border transition-colors overflow-x-scroll " + /*classes*/ ctx[15]); 1065 toggle_class(div0, "border-green-400", /*dragging*/ ctx[14]); 1066 toggle_class(div0, "whitespace-nowrap", !/*wrap*/ ctx[5]); 1067 toggle_class(div1, "mt-6", /*label*/ ctx[1] && /*label*/ ctx[1].length !== 0); 1068 }, 1069 m(target, anchor) { 1070 insert(target, div1, anchor); 1071 if (if_block0) if_block0.m(div1, null); 1072 append(div1, t0); 1073 append(div1, div0); 1074 mount_component(upload, div0, null); 1075 append(div1, t1); 1076 if (if_block1) if_block1.m(div1, null); 1077 current = true; 1078 1079 if (!mounted) { 1080 dispose = [ 1081 listen(window, "click", /*handle_click_outside*/ ctx[25]), 1082 listen(window, "touchstart", /*handle_click_outside*/ ctx[25]) 1083 ]; 1084 1085 mounted = true; 1086 } 1087 }, 1088 p(ctx, dirty) { 1089 if (/*label*/ ctx[1] && /*label*/ ctx[1].length !== 0) { 1090 if (if_block0) { 1091 if_block0.p(ctx, dirty); 1092 } else { 1093 if_block0 = create_if_block_4(ctx); 1094 if_block0.c(); 1095 if_block0.m(div1, t0); 1096 } 1097 } else if (if_block0) { 1098 if_block0.d(1); 1099 if_block0 = null; 1100 } 1101 1102 const upload_changes = {}; 1103 1104 if (dirty[0] & /*dragging, data, classes, els, selected, editing, datatype, _headers, sort_by, sort_direction, header_edit, label*/ 65475 | dirty[1] & /*$$scope*/ 1073741824) { 1105 upload_changes.$$scope = { dirty, ctx }; 1106 } 1107 1108 if (!updating_dragging && dirty[0] & /*dragging*/ 16384) { 1109 updating_dragging = true; 1110 upload_changes.dragging = /*dragging*/ ctx[14]; 1111 add_flush_callback(() => updating_dragging = false); 1112 } 1113 1114 upload.$set(upload_changes); 1115 1116 if (!current || dirty[0] & /*classes*/ 32768 && div0_class_value !== (div0_class_value = "scroll-hide overflow-hidden rounded-lg relative border transition-colors overflow-x-scroll " + /*classes*/ ctx[15])) { 1117 attr(div0, "class", div0_class_value); 1118 } 1119
1120 if (dirty[0] & /*classes, dragging*/ 49152) { 1121 toggle_class(div0, "border-green-400", /*dragging*/ ctx[14]); 1122 } 1123 1124 if (dirty[0] & /*classes, wrap*/ 32800) { 1125 toggle_class(div0, "whitespace-nowrap", !/*wrap*/ ctx[5]); 1126 } 1127 1128 if (/*editable*/ ctx[4]) { 1129 if (if_block1) { 1130 if_block1.p(ctx, dirty); 1131 } else { 1132 if_block1 = create_if_block(ctx); 1133 if_block1.c(); 1134 if_block1.m(div1, null); 1135 } 1136 } else if (if_block1) { 1137 if_block1.d(1); 1138 if_block1 = null; 1139 } 1140 1141 if (dirty[0] & /*label*/ 2) { 1142 toggle_class(div1, "mt-6", /*label*/ ctx[1] && /*label*/ ctx[1].length !== 0); 1143 } 1144 }, 1145 i(local) { 1146 if (current) return; 1147 transition_in(upload.$$.fragment, local); 1148 current = true; 1149 }, 1150 o(local) { 1151 transition_out(upload.$$.fragment, local); 1152 current = false; 1153 }, 1154 d(detaching) { 1155 if (detaching) detach(div1); 1156 if (if_block0) if_block0.d(); 1157 destroy_component(upload); 1158 if (if_block1) if_block1.d(); 1159 mounted = false; 1160 run_all(dispose); 1161 } 1162 }; 1163} 1164 1165function guess_delimitaor(text, possibleDelimiters) { 1166 return possibleDelimiters.filter(weedOut); 1167 1168 function weedOut(delimiter) { 1169 var cache = -1; 1170 return text.split("\n").every(checkLength); 1171 1172 function checkLength(line) { 1173 if (!line) { 1174 return true; 1175 } 1176 1177 var length = line.split(delimiter).length; 1178 1179 if (cache < 0) { 1180 cache = length; 1181 } 1182 1183 return cache === length && length > 1; 1184 } 1185 } 1186} 1187 1188function data_uri_to_blob(data_uri) { 1189 const byte_str = atob(data_uri.split(",")[1]); 1190 const mime_str = data_uri.split(",")[0].split(":")[1].split(";")[0]; 1191 const ab = new ArrayBuffer(byte_str.length); 1192 const ia = new Uint8Array(ab); 1193 1194 for (let i = 0; i < byte_str.length; i++) { 1195 ia[i] = byte_str.charCodeAt(i); 1196 } 1197 1198 return new Blob([ab], { type: mime_str }); 1199} 1200 1201function instance$1($$self, $$props, $$invalidate) { 1202 let classes; 1203 let { datatype } = $$props; 1204 let { label = null } = $$props; 1205 let { headers = [] } = $$props; 1206 let { values = [[]] } = $$props; 1207 let { col_count } = $$props; 1208 let { row_count } = $$props; 1209 let { editable = true } = $$props; 1210 let { style = {} } = $$props; 1211 let { wrap = false } = $$props; 1212 const dispatch = createEventDispatcher(); 1213 let editing = false; 1214 let selected = false; 1215 let els = {}; 1216 1217 function make_headers(_head) { 1218 let _h = _head || []; 1219 1220 if (col_count[1] === "fixed" && _h.length < col_count[0]) { 1221 const fill = Array(col_count[0] - _h.length).fill("").map((_, i) => `${i + _h.length}`); 1222 _h = _h.concat(fill); 1223 } 1224 1225 if (!_h || _h.length === 0) { 1226 return Array(col_count[0]).fill(0).map((_, i) => { 1227 const _id = `h-${i}`; 1228 $$invalidate(10, els[_id] = { cell: null, input: null }, els); 1229 return { id: _id, value: JSON.stringify(i + 1) }; 1230 }); 1231 } else { 1232 return _h.map((h, i) => { 1233 const _id = `h-${i}`; 1234 $$invalidate(10, els[_id] = { cell: null, input: null }, els); 1235 return { id: _id, value: h ?? "" }; 1236 }); 1237 } 1238 } 1239 1240 function process_data(_values) { 1241 const data_row_length = _values.length > 0 ? _values.length : row_count[0]; 1242 1243 return Array(row_count[1] === "fixed" 1244 ? row_count[0] 1245 : data_row_length < row_count[0] 1246 ? row_count[0] 1247 : data_row_length).fill(0).map((_, i) => Array(col_count[1] === "fixed" 1248 ? col_count[0] 1249 : _values[0].length).fill(0).map((_, j) => { 1250 const id = `${i}-${j}`; 1251 $$invalidate(10, els[id] = { input: null, cell: null }, els); 1252 return { value: _values?.[i]?.[j] ?? "", id }; 1253 })); 1254 } 1255 1256 let _headers = make_headers(headers); 1257 let old_headers; 1258 1259 async function refresh_focus() { 1260 if (typeof editing === "string") { 1261 await tick(); 1262 els[editing]?.input?.focus(); 1263 } else if (typeof selected === "string") { 1264 await tick(); 1265 els[selected]?.input?.focus(); 1266 } 1267 } 1268 1269 let data = [[]]; 1270 let old_val = undefined; 1271 1272 function get_sort_status(name, sort, direction) { 1273 if (!sort) return "none"; 1274 1275 if (headers[sort] === name) { 1276 if (direction === "asc") return "ascending"; 1277 if (direction === "des") return "descending"; 1278 } 1279 } 1280 1281 function get_current_indices(id) { 1282 return data.reduce( 1283 (acc, arr, i) => { 1284 const j = arr.reduce((acc, data, j) => id === data.id ? j : acc, -1); 1285 return j === -1 ? acc : [i, j]; 1286 },
1287 [-1, -1] 1288 ); 1289 } 1290 1291 async function start_edit(id, clear) { 1292 if (!editable || editing === id) return; 1293 1294 if (clear) { 1295 const [i, j] = get_current_indices(id); 1296 $$invalidate(9, data[i][j].value = "", data); 1297 } 1298 1299 $$invalidate(6, editing = id); 1300 await tick(); 1301 const { input } = els[id]; 1302 input?.focus(); 1303 } 1304 1305 async function handle_keydown(event, i, j, id) { 1306 let is_data; 1307 1308 switch (event.key) { 1309 case "ArrowRight": 1310 if (editing) break; 1311 event.preventDefault(); 1312 is_data = data[i][j + 1]; 1313 $$invalidate(7, selected = is_data ? is_data.id : selected); 1314 break; 1315 case "ArrowLeft": 1316 if (editing) break; 1317 event.preventDefault(); 1318 is_data = data[i][j - 1]; 1319 $$invalidate(7, selected = is_data ? is_data.id : selected); 1320 break; 1321 case "ArrowDown": 1322 if (editing) break; 1323 event.preventDefault(); 1324 is_data = data[i + 1]; 1325 $$invalidate(7, selected = is_data ? is_data[j].id : selected); 1326 break; 1327 case "ArrowUp": 1328 if (editing) break; 1329 event.preventDefault(); 1330 is_data = data[i - 1]; 1331 $$invalidate(7, selected = is_data ? is_data[j].id : selected); 1332 break; 1333 case "Escape": 1334 if (!editable) break; 1335 event.preventDefault(); 1336 $$invalidate(7, selected = editing); 1337 $$invalidate(6, editing = false); 1338 break; 1339 case "Enter": 1340 if (!editable) break; 1341 event.preventDefault(); 1342 if (event.shiftKey) { 1343 add_row(i); 1344 await tick(); 1345 const [pos] = get_current_indices(id); 1346 $$invalidate(7, selected = data[pos + 1][j].id); 1347 } else { 1348 if (editing === id) { 1349 $$invalidate(6, editing = false); 1350 } else { 1351 start_edit(id); 1352 } 1353 } 1354 break; 1355 case "Backspace": 1356 if (!editable) break; 1357 if (!editing) { 1358 event.preventDefault(); 1359 $$invalidate(9, data[i][j].value = "", data); 1360 } 1361 break; 1362 case "Delete": 1363 if (!editable) break; 1364 if (!editing) { 1365 event.preventDefault(); 1366 $$invalidate(9, data[i][j].value = "", data); 1367 } 1368 break; 1369 case "Tab": 1370 let direction = event.shiftKey ? -1 : 1; 1371 let is_data_x = data[i][j + direction]; 1372 let is_data_y = data?.[i + direction]?.[direction > 0 ? 0 : _headers.length - 1]; 1373 let _selected = is_data_x || is_data_y; 1374 if (_selected) { 1375 event.preventDefault(); 1376 $$invalidate(7, selected = _selected ? _selected.id : selected); 1377 } 1378 $$invalidate(6, editing = false); 1379 break; 1380 default: 1381 if ((!editing || editing && editing !== id) && event.key.length === 1) { 1382 start_edit(id, true); 1383 } 1384 break; 1385 } 1386 } 1387 1388 async function handle_cell_click(id) { 1389 if (editing === id) return; 1390 if (selected === id) return; 1391 $$invalidate(6, editing = false); 1392 $$invalidate(7, selected = id); 1393 } 1394 1395 async function set_focus(id, type) { 1396 if (type === "edit" && typeof id == "string") { 1397 await tick(); 1398 els[id].input?.focus(); 1399 } 1400 1401 if (type === "edit" && typeof id == "boolean" && typeof selected === "string") { 1402 let cell = els[selected]?.cell; 1403 await tick(); 1404 cell?.focus(); 1405 } 1406 1407 if (type === "select" && typeof id == "string") { 1408 const { cell } = els[id]; 1409 1410 // cell?.setAttribute("tabindex", "0"); 1411 await tick(); 1412 1413 cell?.focus(); 1414 } 1415 } 1416 1417 let sort_direction; 1418 let sort_by; 1419 1420 function sort(col, dir) { 1421 if (dir === "asc") { 1422 $$invalidate(9, data = data.sort((a, b) => a[col].value < b[col].value ? -1 : 1)); 1423 } else if (dir === "des") { 1424 $$invalidate(9, data = data.sort((a, b) => a[col].value > b[col].value ? -1 : 1)); 1425 } 1426 } 1427 1428 function handle_sort(col) { 1429 if (typeof sort_by !== "number" || sort_by !== col) { 1430 $$invalidate(11, sort_direction = "asc"); 1431 $$invalidate(12, sort_by = col); 1432 } else { 1433 if (sort_direction === "asc") { 1434 $$invalidate(11, sort_direction = "des"); 1435 } else if (sort_direction === "des") { 1436 $$invalidate(11, sort_direction = "asc"); 1437 } 1438 } 1439 1440 sort(col, sort_direction); 1441 } 1442 1443 let header_edit; 1444 1445 async function edit_header(_id, select) { 1446 if (!editable || col_count[1] !== "dynamic" || editing === _id) return; 1447 $$invalidate(13, header_edit = _id); 1448 await tick(); 1449 els[_id].input?.focus(); 1450 if (select) els[_id].input?.select(); 1451 } 1452 1453 function end_header_edit(event) { 1454 if (!editable) return; 1455 1456 switch (event.key) { 1457 case "Escape": 1458 event.preventDefault();
1459 $$invalidate(7, selected = header_edit); 1460 $$invalidate(13, header_edit = false); 1461 break; 1462 case "Enter": 1463 event.preventDefault(); 1464 $$invalidate(7, selected = header_edit); 1465 $$invalidate(13, header_edit = false); 1466 } 1467 } 1468 1469 function add_row(index) { 1470 if (row_count[1] !== "dynamic") return; 1471 1472 data.splice(index ? index + 1 : data.length, 0, Array(data[0].length).fill(0).map((_, i) => { 1473 const _id = `${data.length}-${i}`; 1474 $$invalidate(10, els[_id] = { cell: null, input: null }, els); 1475 return { id: _id, value: "" }; 1476 })); 1477 1478 ((($$invalidate(9, data), $$invalidate(28, values)), $$invalidate(31, old_val)), $$invalidate(27, headers)); 1479 } 1480 1481 async function add_col() { 1482 if (col_count[1] !== "dynamic") return; 1483 1484 for (let i = 0; i < data.length; i++) { 1485 const _id = `${i}-${data[i].length}`; 1486 $$invalidate(10, els[_id] = { cell: null, input: null }, els); 1487 data[i].push({ id: _id, value: "" }); 1488 } 1489 1490 const _id = `h-${_headers.length}`; 1491 $$invalidate(10, els[_id] = { cell: null, input: null }, els); 1492 1493 _headers.push({ 1494 id: _id, 1495 value: `Header ${_headers.length + 1}` 1496 }); 1497 1498 ((($$invalidate(9, data), $$invalidate(28, values)), $$invalidate(31, old_val)), $$invalidate(27, headers)); 1499 ((($$invalidate(8, _headers), $$invalidate(27, headers)), $$invalidate(30, old_headers)), $$invalidate(28, values)); 1500 await tick(); 1501 edit_header(_id, true); 1502 } 1503 1504 function handle_click_outside(event) { 1505 if (typeof editing === "string" && els[editing]) { 1506 if (els[editing].cell !== event.target && !els[editing].cell?.contains(event?.target)) { 1507 $$invalidate(6, editing = false); 1508 } 1509 } 1510 1511 if (typeof header_edit === "string" && els[header_edit]) { 1512 if (els[header_edit].cell !== event.target && !els[header_edit].cell?.contains(event.target)) { 1513 $$invalidate(13, header_edit = false); 1514 } 1515 } 1516 } 1517 1518 function blob_to_string(blob) { 1519 const reader = new FileReader(); 1520 1521 function handle_read(e) { 1522 if (!e?.target?.result || typeof e.target.result !== "string") return; 1523 const [delimiter] = guess_delimitaor(e.target.result, [",", "\t"]); 1524 const [head, ...rest] = dsvFormat(delimiter).parseRows(e.target.result); 1525 1526 $$invalidate(8, _headers = make_headers(col_count[1] === "fixed" 1527 ? head.slice(0, col_count[0]) 1528 : head)); 1529 1530 $$invalidate(28, values = rest); 1531 reader.removeEventListener("loadend", handle_read); 1532 } 1533 1534 reader.addEventListener("loadend", handle_read); 1535 reader.readAsText(blob); 1536 } 1537 1538 let dragging = false; 1539 1540 function editablecell_el_binding(value, id) { 1541 if ($$self.$$.not_equal(els[id].input, value)) { 1542 els[id].input = value; 1543 $$invalidate(10, els); 1544 } 1545 } 1546 1547 const dblclick_handler = id => edit_header(id); 1548 const click_handler = i => handle_sort(i); 1549 1550 function th_binding($$value, id) { 1551 binding_callbacks[$$value ? 'unshift' : 'push'](() => { 1552 els[id].cell = $$value; 1553 $$invalidate(10, els); 1554 }); 1555 } 1556 1557 function editablecell_value_binding(value$1, value, each_value_1, j) { 1558 each_value_1[j].value = value$1; 1559 ((($$invalidate(9, data), $$invalidate(28, values)), $$invalidate(31, old_val)), $$invalidate(27, headers)); 1560 } 1561 1562 function editablecell_el_binding_1(value, id) { 1563 if ($$self.$$.not_equal(els[id].input, value)) { 1564 els[id].input = value; 1565 $$invalidate(10, els); 1566 } 1567 } 1568 1569 function td_binding($$value, id) { 1570 binding_callbacks[$$value ? 'unshift' : 'push'](() => { 1571 els[id].cell = $$value; 1572 $$invalidate(10, els); 1573 }); 1574 } 1575 1576 const touchstart_handler = id => start_edit(id); 1577 const click_handler_1 = id => handle_cell_click(id); 1578 const dblclick_handler_1 = id => start_edit(id); 1579 const keydown_handler = (i, j, id, e) => handle_keydown(e, i, j, id); 1580 1581 function upload_dragging_binding(value) { 1582 dragging = value; 1583 $$invalidate(14, dragging); 1584 } 1585 1586 const load_handler = e => blob_to_string(data_uri_to_blob(e.detail.data)); 1587 const click_handler_2 = () => add_row(); 1588 1589 $$self.$$set = $$props => {
1590 if ('datatype' in $$props) $$invalidate(0, datatype = $$props.datatype); 1591 if ('label' in $$props) $$invalidate(1, label = $$props.label); 1592 if ('headers' in $$props) $$invalidate(27, headers = $$props.headers); 1593 if ('values' in $$props) $$invalidate(28, values = $$props.values); 1594 if ('col_count' in $$props) $$invalidate(2, col_count = $$props.col_count); 1595 if ('row_count' in $$props) $$invalidate(3, row_count = $$props.row_count); 1596 if ('editable' in $$props) $$invalidate(4, editable = $$props.editable); 1597 if ('style' in $$props) $$invalidate(29, style = $$props.style); 1598 if ('wrap' in $$props) $$invalidate(5, wrap = $$props.wrap); 1599 }; 1600 1601 $$self.$$.update = () => { 1602 if ($$self.$$.dirty[0] & /*values, headers*/ 402653184) { 1603 { 1604 if (values && !Array.isArray(values)) { 1605 $$invalidate(27, headers = values.headers); 1606 1607 $$invalidate(28, values = values.data.length === 0 1608 ? [Array(headers.length).fill("")] 1609 : values.data); 1610 } else if (values === null) { 1611 $$invalidate(28, values = [Array(headers.length).fill("")]); 1612 } else { 1613 ($$invalidate(28, values), $$invalidate(27, headers)); 1614 } 1615 } 1616 } 1617 1618 if ($$self.$$.dirty[0] & /*headers, old_headers*/ 1207959552) { 1619 { 1620 if (!dequal(headers, old_headers)) { 1621 $$invalidate(8, _headers = make_headers(headers)); 1622 $$invalidate(30, old_headers = headers); 1623 refresh_focus(); 1624 } 1625 } 1626 } 1627 1628 if ($$self.$$.dirty[0] & /*values*/ 268435456 | $$self.$$.dirty[1] & /*old_val*/ 1) { 1629 if (!dequal(values, old_val)) { 1630 $$invalidate(9, data = process_data(values)); 1631 $$invalidate(31, old_val = values); 1632 refresh_focus(); 1633 } 1634 } 1635 1636 if ($$self.$$.dirty[0] & /*_headers, data*/ 768) { 1637 _headers && dispatch("change", { 1638 data: data.map(r => r.map(({ value }) => value)), 1639 headers: _headers.map(h => h.value) 1640 }); 1641 } 1642 1643 if ($$self.$$.dirty[0] & /*editing*/ 64) { 1644 set_focus(editing, "edit"); 1645 } 1646 1647 if ($$self.$$.dirty[0] & /*selected*/ 128) { 1648 set_focus(selected, "select"); 1649 } 1650 1651 if ($$self.$$.dirty[0] & /*style*/ 536870912) { 1652 $$invalidate(15, { classes } = get_styles(style, ["rounded"]), classes); 1653 } 1654 }; 1655 1656 return [ 1657 datatype, 1658 label, 1659 col_count, 1660 row_count, 1661 editable, 1662 wrap, 1663 editing, 1664 selected, 1665 _headers, 1666 data, 1667 els, 1668 sort_direction, 1669 sort_by, 1670 header_edit, 1671 dragging, 1672 classes, 1673 get_sort_status, 1674 start_edit, 1675 handle_keydown, 1676 handle_cell_click, 1677 handle_sort, 1678 edit_header, 1679 end_header_edit, 1680 add_row, 1681 add_col, 1682 handle_click_outside, 1683 blob_to_string, 1684 headers, 1685 values, 1686 style, 1687 old_headers, 1688 old_val, 1689 editablecell_el_binding, 1690 dblclick_handler, 1691 click_handler, 1692 th_binding, 1693 editablecell_value_binding, 1694 editablecell_el_binding_1, 1695 td_binding, 1696 touchstart_handler, 1697 click_handler_1, 1698 dblclick_handler_1, 1699 keydown_handler, 1700 upload_dragging_binding, 1701 load_handler, 1702 click_handler_2 1703 ]; 1704} 1705 1706class Table extends SvelteComponent { 1707 constructor(options) { 1708 super(); 1709 1710 init( 1711 this, 1712 options, 1713 instance$1, 1714 create_fragment$1, 1715 safe_not_equal, 1716 { 1717 datatype: 0, 1718 label: 1, 1719 headers: 27, 1720 values: 28, 1721 col_count: 2, 1722 row_count: 3, 1723 editable: 4, 1724 style: 29, 1725 wrap: 5 1726 }, 1727 null, 1728 [-1, -1] 1729 ); 1730 } 1731} 1732 1733/* src/components/DataFrame/DataFrame.svelte generated by Svelte v3.49.0 */ 1734 1735function create_fragment(ctx) { 1736 let div; 1737 let statustracker; 1738 let t; 1739 let table; 1740 let current; 1741 const statustracker_spread_levels = [/*loading_status*/ ctx[12]]; 1742 let statustracker_props = {}; 1743 1744 for (let i = 0; i < statustracker_spread_levels.length; i += 1) { 1745 statustracker_props = assign(statustracker_props, statustracker_spread_levels[i]); 1746 } 1747 1748 statustracker = new StatusTracker({ props: statustracker_props }); 1749 1750 table = new Table({ 1751 props: { 1752 label: /*label*/ ctx[9], 1753 row_count: /*row_count*/ ctx[6], 1754 col_count: /*col_count*/ ctx[5], 1755 values: /*value*/ ctx[0], 1756 headers: /*headers*/ ctx[1], 1757 editable: /*mode*/ ctx[4] === "dynamic", 1758 style: /*style*/ ctx[8], 1759 wrap: /*wrap*/ ctx[10], 1760 datatype: /*datatype*/ ctx[11] 1761 } 1762 }); 1763 1764 table.$on("change", /*change_handler*/ ctx[14]); 1765 1766 return { 1767 c() { 1768 div = element("div"); 1769 create_component(statustracker.$$.fragment); 1770 t = space(); 1771 create_component(table.$$.fragment); 1772 attr(div, "id", /*elem_id*/ ctx[2]); 1773 attr(div, "class", "relative overflow-hidden"); 1774 toggle_class(div, "flex-1", /*parent*/ ctx[7] === "row" || !/*parent*/ ctx[7]); 1775 toggle_class(div, "!hidden", !/*visible*/ ctx[3]); 1776 }, 1777 m(target, anchor) { 1778 insert(target, div, anchor);
1779 mount_component(statustracker, div, null); 1780 append(div, t); 1781 mount_component(table, div, null); 1782 current = true; 1783 }, 1784 p(ctx, [dirty]) { 1785 const statustracker_changes = (dirty & /*loading_status*/ 4096) 1786 ? get_spread_update(statustracker_spread_levels, [get_spread_object(/*loading_status*/ ctx[12])]) 1787 : {}; 1788 1789 statustracker.$set(statustracker_changes); 1790 const table_changes = {}; 1791 if (dirty & /*label*/ 512) table_changes.label = /*label*/ ctx[9]; 1792 if (dirty & /*row_count*/ 64) table_changes.row_count = /*row_count*/ ctx[6]; 1793 if (dirty & /*col_count*/ 32) table_changes.col_count = /*col_count*/ ctx[5]; 1794 if (dirty & /*value*/ 1) table_changes.values = /*value*/ ctx[0]; 1795 if (dirty & /*headers*/ 2) table_changes.headers = /*headers*/ ctx[1]; 1796 if (dirty & /*mode*/ 16) table_changes.editable = /*mode*/ ctx[4] === "dynamic"; 1797 if (dirty & /*style*/ 256) table_changes.style = /*style*/ ctx[8]; 1798 if (dirty & /*wrap*/ 1024) table_changes.wrap = /*wrap*/ ctx[10]; 1799 if (dirty & /*datatype*/ 2048) table_changes.datatype = /*datatype*/ ctx[11]; 1800 table.$set(table_changes); 1801 1802 if (!current || dirty & /*elem_id*/ 4) { 1803 attr(div, "id", /*elem_id*/ ctx[2]); 1804 } 1805 1806 if (dirty & /*parent*/ 128) { 1807 toggle_class(div, "flex-1", /*parent*/ ctx[7] === "row" || !/*parent*/ ctx[7]); 1808 } 1809 1810 if (dirty & /*visible*/ 8) { 1811 toggle_class(div, "!hidden", !/*visible*/ ctx[3]); 1812 } 1813 }, 1814 i(local) { 1815 if (current) return; 1816 transition_in(statustracker.$$.fragment, local); 1817 transition_in(table.$$.fragment, local); 1818 current = true; 1819 }, 1820 o(local) { 1821 transition_out(statustracker.$$.fragment, local); 1822 transition_out(table.$$.fragment, local); 1823 current = false; 1824 }, 1825 d(detaching) { 1826 if (detaching) detach(div); 1827 destroy_component(statustracker); 1828 destroy_component(table); 1829 } 1830 }; 1831} 1832 1833function instance($$self, $$props, $$invalidate) { 1834 let { headers = [] } = $$props; 1835 let { elem_id = "" } = $$props; 1836 let { visible = true } = $$props; 1837 1838 let { value = { 1839 data: [["", "", ""]], 1840 headers: ["1", "2", "3"] 1841 } } = $$props; 1842 1843 let { mode } = $$props; 1844 let { col_count } = $$props; 1845 let { row_count } = $$props; 1846 let { parent = null } = $$props; 1847 let { style = {} } = $$props; 1848 let { label = null } = $$props; 1849 let { wrap } = $$props; 1850 let { datatype } = $$props; 1851 const dispatch = createEventDispatcher(); 1852 let { loading_status } = $$props; 1853 1854 async function handle_change(detail) { 1855 $$invalidate(0, value = detail); 1856 await tick(); 1857 dispatch("change", detail); 1858 } 1859 1860 const change_handler = ({ detail }) => handle_change(detail); 1861 1862 $$self.$$set = $$props => {
1863 if ('headers' in $$props) $$invalidate(1, headers = $$props.headers); 1864 if ('elem_id' in $$props) $$invalidate(2, elem_id = $$props.elem_id); 1865 if ('visible' in $$props) $$invalidate(3, visible = $$props.visible); 1866 if ('value' in $$props) $$invalidate(0, value = $$props.value); 1867 if ('mode' in $$props) $$invalidate(4, mode = $$props.mode); 1868 if ('col_count' in $$props) $$invalidate(5, col_count = $$props.col_count); 1869 if ('row_count' in $$props) $$invalidate(6, row_count = $$props.row_count); 1870 if ('parent' in $$props) $$invalidate(7, parent = $$props.parent); 1871 if ('style' in $$props) $$invalidate(8, style = $$props.style); 1872 if ('label' in $$props) $$invalidate(9, label = $$props.label); 1873 if ('wrap' in $$props) $$invalidate(10, wrap = $$props.wrap); 1874 if ('datatype' in $$props) $$invalidate(11, datatype = $$props.datatype); 1875 if ('loading_status' in $$props) $$invalidate(12, loading_status = $$props.loading_status); 1876 }; 1877 1878 return [ 1879 value, 1880 headers, 1881 elem_id, 1882 visible, 1883 mode, 1884 col_count, 1885 row_count, 1886 parent, 1887 style, 1888 label, 1889 wrap, 1890 datatype, 1891 loading_status, 1892 handle_change, 1893 change_handler 1894 ]; 1895} 1896 1897class DataFrame extends SvelteComponent { 1898 constructor(options) { 1899 super(); 1900 1901 init(this, options, instance, create_fragment, safe_not_equal, { 1902 headers: 1, 1903 elem_id: 2, 1904 visible: 3, 1905 value: 0, 1906 mode: 4, 1907 col_count: 5, 1908 row_count: 6, 1909 parent: 7, 1910 style: 8, 1911 label: 9, 1912 wrap: 10, 1913 datatype: 11, 1914 loading_status: 12 1915 }); 1916 } 1917} 1918 1919var DataFrame$1 = DataFrame; 1920 1921const modes = ["static", "dynamic"]; 1922 1923export { DataFrame$1 as Component, modes };
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.