Counter and Copy Paste

bundle.css

@@ -5,4 +5,6 @@
 #overlayText.svelte-c2nwl9{position:absolute;top:3%;left:3%;color:black;background-color:white;font:bold 15;border:black solid}
 .button.svelte-cpjgti{cursor:allowed}.button-at-end.svelte-cpjgti{background-color:red;color:white;cursor:not-allowed}
 .component-containter.svelte-bsj1sx{background-color:rgba(113, 239, 97, 0.626)}.comment.svelte-bsj1sx{border:1px solid #2e7f41;padding:8px;margin-top:8px}.top-level-comment.svelte-bsj1sx{border:1px solid blue;background-color:rgba(42, 114, 215, 0.5);margin-bottom:15px}
+.item.svelte-bmbf24{cursor:pointer;margin:5px;padding:5px;border:1px solid #ccc;border-radius:4px;background-color:white}textarea.svelte-bmbf24{width:100%;height:100px;margin-bottom:10px}
+.word-button.svelte-13vjncp{margin:2px;padding:5px;color:wheat}input.svelte-13vjncp,button.svelte-13vjncp{margin:5px}
 main.svelte-1tky8bj{text-align:center;padding:1em;max-width:240px;margin:0 auto}h1.svelte-1tky8bj{color:#ff3e00;text-transform:uppercase;font-size:4em;font-weight:100}@media(min-width: 640px){main.svelte-1tky8bj{max-width:none}}

bundle.js

@@ -340,6 +340,11 @@ var app = (function () {
             callback();
         }
     }
+
+    function destroy_block(block, lookup) {
+        block.d(1);
+        lookup.delete(block.key);
+    }
     function outro_and_destroy_block(block, lookup) {
         transition_out(block, 1, 1, () => {
             lookup.delete(block.key);
@@ -655,17 +660,17 @@ var app = (function () {
 
     /* src\VideoGradioComponentBrainstorming.svelte generated by Svelte v3.59.2 */
 
-    const { console: console_1$4 } = globals;
-    const file$7 = "src\\VideoGradioComponentBrainstorming.svelte";
+    const { console: console_1$5 } = globals;
+    const file$9 = "src\\VideoGradioComponentBrainstorming.svelte";
 
-    function get_each_context$3(ctx, list, i) {
+    function get_each_context$5(ctx, list, i) {
     	const child_ctx = ctx.slice();
     	child_ctx[15] = list[i];
     	return child_ctx;
     }
 
     // (85:4) {#each kitchenOptions as option}
-    function create_each_block$3(ctx) {
+    function create_each_block$5(ctx) {
     	let option;
     	let t_value = /*option*/ ctx[15] + "";
     	let t;
@@ -676,7 +681,7 @@ var app = (function () {
     			t = text(t_value);
     			option.__value = /*option*/ ctx[15];
     			option.value = option.__value;
-    			add_location(option, file$7, 85, 6, 2561);
+    			add_location(option, file$9, 85, 6, 2561);
     		},
     		m: function mount(target, anchor) {
     			insert_dev(target, option, anchor);
@@ -690,7 +695,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_each_block$3.name,
+    		id: create_each_block$5.name,
     		type: "each",
     		source: "(85:4) {#each kitchenOptions as option}",
     		ctx
@@ -699,7 +704,7 @@ var app = (function () {
     	return block;
     }
 
-    function create_fragment$7(ctx) {
+    function create_fragment$9(ctx) {
     	let h1;
     	let t1;
     	let div1;
@@ -726,7 +731,7 @@ var app = (function () {
     	let each_blocks = [];
 
     	for (let i = 0; i < each_value.length; i += 1) {
-    		each_blocks[i] = create_each_block$3(get_each_context$3(ctx, each_value, i));
+    		each_blocks[i] = create_each_block$5(get_each_context$5(ctx, each_value, i));
     	}
 
     	const block = {
@@ -756,34 +761,34 @@ var app = (function () {
     				each_blocks[i].c();
     			}
 
-    			add_location(h1, file$7, 66, 0, 1800);
+    			add_location(h1, file$9, 66, 0, 1800);
     			attr_dev(track, "kind", "captions");
     			if (!src_url_equal(track.src, track_src_value = "path/to/your/captions/file.vtt")) attr_dev(track, "src", track_src_value);
     			attr_dev(track, "srclang", "en");
     			attr_dev(track, "label", "English");
-    			add_location(track, file$7, 72, 4, 2006);
+    			add_location(track, file$9, 72, 4, 2006);
     			attr_dev(video, "id", "videoCanvas");
     			video.autoplay = true;
     			attr_dev(video, "class", "svelte-ufd3fo");
-    			add_location(video, file$7, 70, 2, 1965);
+    			add_location(video, file$9, 70, 2, 1965);
     			attr_dev(div0, "id", "overlayText");
     			attr_dev(div0, "class", "svelte-ufd3fo");
-    			add_location(div0, file$7, 74, 2, 2111);
+    			add_location(div0, file$9, 74, 2, 2111);
     			attr_dev(div1, "id", "videoContainer");
     			attr_dev(div1, "class", "svelte-ufd3fo");
-    			add_location(div1, file$7, 68, 0, 1911);
+    			add_location(div1, file$9, 68, 0, 1911);
     			attr_dev(canvas_1, "id", "myCanvas");
     			set_style(canvas_1, "border", "2px solid black");
     			attr_dev(canvas_1, "width", "500");
     			attr_dev(canvas_1, "height", "500");
-    			add_location(canvas_1, file$7, 77, 0, 2186);
+    			add_location(canvas_1, file$9, 77, 0, 2186);
     			attr_dev(input, "type", "text");
-    			add_location(input, file$7, 78, 0, 2294);
-    			add_location(button, file$7, 82, 2, 2429);
+    			add_location(input, file$9, 78, 0, 2294);
+    			add_location(button, file$9, 82, 2, 2429);
     			if (/*selectedOption*/ ctx[0] === void 0) add_render_callback(() => /*select_change_handler*/ ctx[9].call(select));
-    			add_location(select, file$7, 83, 2, 2479);
+    			add_location(select, file$9, 83, 2, 2479);
     			attr_dev(div2, "id", "frameForButtons");
-    			add_location(div2, file$7, 81, 0, 2399);
+    			add_location(div2, file$9, 81, 0, 2399);
     		},
     		l: function claim(nodes) {
     			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -842,12 +847,12 @@ var app = (function () {
     				let i;
 
     				for (i = 0; i < each_value.length; i += 1) {
-    					const child_ctx = get_each_context$3(ctx, each_value, i);
+    					const child_ctx = get_each_context$5(ctx, each_value, i);
 
     					if (each_blocks[i]) {
     						each_blocks[i].p(child_ctx, dirty);
     					} else {
-    						each_blocks[i] = create_each_block$3(child_ctx);
+    						each_blocks[i] = create_each_block$5(child_ctx);
     						each_blocks[i].c();
     						each_blocks[i].m(select, null);
     					}
@@ -885,7 +890,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_fragment$7.name,
+    		id: create_fragment$9.name,
     		type: "component",
     		source: "",
     		ctx
@@ -898,7 +903,7 @@ var app = (function () {
     	
     } // Logic for 'Test OCR' button
 
-    function instance$7($$self, $$props, $$invalidate) {
+    function instance$9($$self, $$props, $$invalidate) {
     	let { $$slots: slots = {}, $$scope } = $$props;
     	validate_slots('VideoGradioComponentBrainstorming', slots, []);
     	let selectedOption = 'Stove - lu'; // default value
@@ -960,7 +965,7 @@ var app = (function () {
     	const writable_props = [];
 
     	Object.keys($$props).forEach(key => {
-    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$4.warn(`<VideoGradioComponentBrainstorming> was created with unknown prop '${key}'`);
+    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$5.warn(`<VideoGradioComponentBrainstorming> was created with unknown prop '${key}'`);
     	});
 
     	function canvas_1_binding($$value) {
@@ -1031,13 +1036,13 @@ var app = (function () {
     class VideoGradioComponentBrainstorming extends SvelteComponentDev {
     	constructor(options) {
     		super(options);
-    		init(this, options, instance$7, create_fragment$7, safe_not_equal, {});
+    		init(this, options, instance$9, create_fragment$9, safe_not_equal, {});
 
     		dispatch_dev("SvelteRegisterComponent", {
     			component: this,
     			tagName: "VideoGradioComponentBrainstorming",
     			options,
-    			id: create_fragment$7.name
+    			id: create_fragment$9.name
     		});
     	}
     }
@@ -1091,9 +1096,9 @@ var app = (function () {
     }
 
     /* src\MovingDotPortfromReact.svelte generated by Svelte v3.59.2 */
-    const file$6 = "src\\MovingDotPortfromReact.svelte";
+    const file$8 = "src\\MovingDotPortfromReact.svelte";
 
-    function create_fragment$6(ctx) {
+    function create_fragment$8(ctx) {
     	let button;
 
     	const block = {
@@ -1103,7 +1108,7 @@ var app = (function () {
     			set_style(button, "left", /*position*/ ctx[0].x + "px");
     			set_style(button, "top", /*position*/ ctx[0].y + "px");
     			attr_dev(button, "tabindex", "0");
-    			add_location(button, file$6, 48, 0, 1573);
+    			add_location(button, file$8, 48, 0, 1573);
     		},
     		l: function claim(nodes) {
     			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -1131,7 +1136,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_fragment$6.name,
+    		id: create_fragment$8.name,
     		type: "component",
     		source: "",
     		ctx
@@ -1142,7 +1147,7 @@ var app = (function () {
 
     const step = 10;
 
-    function instance$6($$self, $$props, $$invalidate) {
+    function instance$8($$self, $$props, $$invalidate) {
     	let { $$slots: slots = {}, $$scope } = $$props;
     	validate_slots('MovingDotPortfromReact', slots, []);
     	let { position = { x: 0, y: 0 } } = $$props;
@@ -1247,13 +1252,13 @@ var app = (function () {
     class MovingDotPortfromReact extends SvelteComponentDev {
     	constructor(options) {
     		super(options);
-    		init(this, options, instance$6, create_fragment$6, safe_not_equal, { position: 0, boundaries: 2, focusDot: 3 });
+    		init(this, options, instance$8, create_fragment$8, safe_not_equal, { position: 0, boundaries: 2, focusDot: 3 });
 
     		dispatch_dev("SvelteRegisterComponent", {
     			component: this,
     			tagName: "MovingDotPortfromReact",
     			options,
-    			id: create_fragment$6.name
+    			id: create_fragment$8.name
     		});
     	}
 
@@ -1284,9 +1289,9 @@ var app = (function () {
 
     /* src\MovingDotTargetPortfromReact.svelte generated by Svelte v3.59.2 */
 
-    const file$5 = "src\\MovingDotTargetPortfromReact.svelte";
+    const file$7 = "src\\MovingDotTargetPortfromReact.svelte";
 
-    function create_fragment$5(ctx) {
+    function create_fragment$7(ctx) {
     	let div;
 
     	const block = {
@@ -1295,7 +1300,7 @@ var app = (function () {
     			attr_dev(div, "class", "target svelte-4yc66h");
     			set_style(div, "left", /*position*/ ctx[0].x + "px");
     			set_style(div, "top", /*position*/ ctx[0].y + "px");
-    			add_location(div, file$5, 4, 0, 49);
+    			add_location(div, file$7, 4, 0, 49);
     		},
     		l: function claim(nodes) {
     			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -1321,7 +1326,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_fragment$5.name,
+    		id: create_fragment$7.name,
     		type: "component",
     		source: "",
     		ctx
@@ -1330,7 +1335,7 @@ var app = (function () {
     	return block;
     }
 
-    function instance$5($$self, $$props, $$invalidate) {
+    function instance$7($$self, $$props, $$invalidate) {
     	let { $$slots: slots = {}, $$scope } = $$props;
     	validate_slots('MovingDotTargetPortfromReact', slots, []);
     	let { position } = $$props;
@@ -1367,13 +1372,13 @@ var app = (function () {
     class MovingDotTargetPortfromReact extends SvelteComponentDev {
     	constructor(options) {
     		super(options);
-    		init(this, options, instance$5, create_fragment$5, safe_not_equal, { position: 0 });
+    		init(this, options, instance$7, create_fragment$7, safe_not_equal, { position: 0 });
 
     		dispatch_dev("SvelteRegisterComponent", {
     			component: this,
     			tagName: "MovingDotTargetPortfromReact",
     			options,
-    			id: create_fragment$5.name
+    			id: create_fragment$7.name
     		});
     	}
 
@@ -1388,17 +1393,17 @@ var app = (function () {
 
     /* src\SimpleModal.svelte generated by Svelte v3.59.2 */
 
-    const { console: console_1$3 } = globals;
-    const file$4 = "src\\SimpleModal.svelte";
+    const { console: console_1$4 } = globals;
+    const file$6 = "src\\SimpleModal.svelte";
 
-    function get_each_context$2(ctx, list, i) {
+    function get_each_context$4(ctx, list, i) {
     	const child_ctx = ctx.slice();
     	child_ctx[8] = list[i];
     	return child_ctx;
     }
 
     // (22:0) {#if isOpen}
-    function create_if_block$2(ctx) {
+    function create_if_block$3(ctx) {
     	let div3;
     	let div2;
     	let div0;
@@ -1418,7 +1423,7 @@ var app = (function () {
     	let each_blocks = [];
 
     	for (let i = 0; i < each_value.length; i += 1) {
-    		each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i));
+    		each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i));
     	}
 
     	const block = {
@@ -1441,18 +1446,18 @@ var app = (function () {
     				each_blocks[i].c();
     			}
 
-    			add_location(h2, file$4, 25, 8, 651);
-    			add_location(button, file$4, 26, 8, 677);
+    			add_location(h2, file$6, 25, 8, 651);
+    			add_location(button, file$6, 26, 8, 677);
     			attr_dev(div0, "class", "modal-header svelte-m51ous");
-    			add_location(div0, file$4, 24, 6, 615);
+    			add_location(div0, file$6, 24, 6, 615);
     			attr_dev(ul, "class", "modal-items");
-    			add_location(ul, file$4, 30, 8, 801);
+    			add_location(ul, file$6, 30, 8, 801);
     			attr_dev(div1, "class", "modal-content svelte-m51ous");
-    			add_location(div1, file$4, 28, 6, 745);
+    			add_location(div1, file$6, 28, 6, 745);
     			attr_dev(div2, "class", "modal svelte-m51ous");
-    			add_location(div2, file$4, 23, 4, 588);
+    			add_location(div2, file$6, 23, 4, 588);
     			attr_dev(div3, "class", "modal-overlay svelte-m51ous");
-    			add_location(div3, file$4, 22, 2, 555);
+    			add_location(div3, file$6, 22, 2, 555);
     		},
     		m: function mount(target, anchor) {
     			insert_dev(target, div3, anchor);
@@ -1489,12 +1494,12 @@ var app = (function () {
     				let i;
 
     				for (i = 0; i < each_value.length; i += 1) {
-    					const child_ctx = get_each_context$2(ctx, each_value, i);
+    					const child_ctx = get_each_context$4(ctx, each_value, i);
 
     					if (each_blocks[i]) {
     						each_blocks[i].p(child_ctx, dirty);
     					} else {
-    						each_blocks[i] = create_each_block$2(child_ctx);
+    						each_blocks[i] = create_each_block$4(child_ctx);
     						each_blocks[i].c();
     						each_blocks[i].m(ul, null);
     					}
@@ -1517,7 +1522,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_if_block$2.name,
+    		id: create_if_block$3.name,
     		type: "if",
     		source: "(22:0) {#if isOpen}",
     		ctx
@@ -1527,7 +1532,7 @@ var app = (function () {
     }
 
     // (32:10) {#each items as item}
-    function create_each_block$2(ctx) {
+    function create_each_block$4(ctx) {
     	let button;
     	let t_value = /*item*/ ctx[8].label + "";
     	let t;
@@ -1542,7 +1547,7 @@ var app = (function () {
     		c: function create() {
     			button = element("button");
     			t = text(t_value);
-    			add_location(button, file$4, 32, 12, 872);
+    			add_location(button, file$6, 32, 12, 872);
     		},
     		m: function mount(target, anchor) {
     			insert_dev(target, button, anchor);
@@ -1566,7 +1571,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_each_block$2.name,
+    		id: create_each_block$4.name,
     		type: "each",
     		source: "(32:10) {#each items as item}",
     		ctx
@@ -1575,9 +1580,9 @@ var app = (function () {
     	return block;
     }
 
-    function create_fragment$4(ctx) {
+    function create_fragment$6(ctx) {
     	let if_block_anchor;
-    	let if_block = /*isOpen*/ ctx[0] && create_if_block$2(ctx);
+    	let if_block = /*isOpen*/ ctx[0] && create_if_block$3(ctx);
 
     	const block = {
     		c: function create() {
@@ -1596,7 +1601,7 @@ var app = (function () {
     				if (if_block) {
     					if_block.p(ctx, dirty);
     				} else {
-    					if_block = create_if_block$2(ctx);
+    					if_block = create_if_block$3(ctx);
     					if_block.c();
     					if_block.m(if_block_anchor.parentNode, if_block_anchor);
     				}
@@ -1615,7 +1620,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_fragment$4.name,
+    		id: create_fragment$6.name,
     		type: "component",
     		source: "",
     		ctx
@@ -1624,7 +1629,7 @@ var app = (function () {
     	return block;
     }
 
-    function instance$4($$self, $$props, $$invalidate) {
+    function instance$6($$self, $$props, $$invalidate) {
     	let { $$slots: slots = {}, $$scope } = $$props;
     	validate_slots('SimpleModal', slots, []);
     	let { isOpen = false } = $$props;
@@ -1648,14 +1653,14 @@ var app = (function () {
 
     	$$self.$$.on_mount.push(function () {
     		if (onClose === undefined && !('onClose' in $$props || $$self.$$.bound[$$self.$$.props['onClose']])) {
-    			console_1$3.warn("<SimpleModal> was created without expected prop 'onClose'");
+    			console_1$4.warn("<SimpleModal> was created without expected prop 'onClose'");
     		}
     	});
 
     	const writable_props = ['isOpen', 'title', 'content', 'items', 'onClose'];
 
     	Object.keys($$props).forEach(key => {
-    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$3.warn(`<SimpleModal> was created with unknown prop '${key}'`);
+    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$4.warn(`<SimpleModal> was created with unknown prop '${key}'`);
     	});
 
     	const click_handler = item => handleItemClick(item);
@@ -1706,7 +1711,7 @@ var app = (function () {
     	constructor(options) {
     		super(options);
 
-    		init(this, options, instance$4, create_fragment$4, safe_not_equal, {
+    		init(this, options, instance$6, create_fragment$6, safe_not_equal, {
     			isOpen: 0,
     			title: 1,
     			content: 2,
@@ -1718,7 +1723,7 @@ var app = (function () {
     			component: this,
     			tagName: "SimpleModal",
     			options,
-    			id: create_fragment$4.name
+    			id: create_fragment$6.name
     		});
     	}
 
@@ -1765,17 +1770,17 @@ var app = (function () {
 
     /* src\MovingDotSpacePortfromReact.svelte generated by Svelte v3.59.2 */
 
-    const { console: console_1$2 } = globals;
-    const file$3 = "src\\MovingDotSpacePortfromReact.svelte";
+    const { console: console_1$3 } = globals;
+    const file$5 = "src\\MovingDotSpacePortfromReact.svelte";
 
-    function get_each_context$1(ctx, list, i) {
+    function get_each_context$3(ctx, list, i) {
     	const child_ctx = ctx.slice();
     	child_ctx[19] = list[i];
     	return child_ctx;
     }
 
     // (155:4) {#each $targets as target (target.name)}
-    function create_each_block$1(key_1, ctx) {
+    function create_each_block$3(key_1, ctx) {
     	let first;
     	let target;
     	let t0;
@@ -1801,7 +1806,7 @@ var app = (function () {
     			set_style(span, "position", "absolute");
     			set_style(span, "left", /*target*/ ctx[19].x + "px");
     			set_style(span, "top", /*target*/ ctx[19].y + "px");
-    			add_location(span, file$3, 156, 8, 7641);
+    			add_location(span, file$5, 156, 8, 7641);
     			this.first = first;
     		},
     		m: function mount(target$1, anchor) {
@@ -1846,7 +1851,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_each_block$1.name,
+    		id: create_each_block$3.name,
     		type: "each",
     		source: "(155:4) {#each $targets as target (target.name)}",
     		ctx
@@ -1856,7 +1861,7 @@ var app = (function () {
     }
 
     // (161:4) {#if isModalOpen}
-    function create_if_block$1(ctx) {
+    function create_if_block$2(ctx) {
     	let modal;
     	let current;
 
@@ -1902,7 +1907,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_if_block$1.name,
+    		id: create_if_block$2.name,
     		type: "if",
     		source: "(161:4) {#if isModalOpen}",
     		ctx
@@ -1911,7 +1916,7 @@ var app = (function () {
     	return block;
     }
 
-    function create_fragment$3(ctx) {
+    function create_fragment$5(ctx) {
     	let div1;
     	let canvas_1;
     	let t0;
@@ -1943,15 +1948,15 @@ var app = (function () {
     	let each_value = /*$targets*/ ctx[6];
     	validate_each_argument(each_value);
     	const get_key = ctx => /*target*/ ctx[19].name;
-    	validate_each_keys(ctx, each_value, get_each_context$1, get_key);
+    	validate_each_keys(ctx, each_value, get_each_context$3, get_key);
 
     	for (let i = 0; i < each_value.length; i += 1) {
-    		let child_ctx = get_each_context$1(ctx, each_value, i);
+    		let child_ctx = get_each_context$3(ctx, each_value, i);
     		let key = get_key(child_ctx);
-    		each_1_lookup.set(key, each_blocks[i] = create_each_block$1(key, child_ctx));
+    		each_1_lookup.set(key, each_blocks[i] = create_each_block$3(key, child_ctx));
     	}
 
-    	let if_block = /*isModalOpen*/ ctx[2] && create_if_block$1(ctx);
+    	let if_block = /*isModalOpen*/ ctx[2] && create_if_block$2(ctx);
 
     	const block = {
     		c: function create() {
@@ -1976,13 +1981,13 @@ var app = (function () {
     			set_style(canvas_1, "width", "100%");
     			set_style(canvas_1, "height", "100%");
     			attr_dev(canvas_1, "tabindex", "0");
-    			add_location(canvas_1, file$3, 151, 4, 7167);
+    			add_location(canvas_1, file$5, 151, 4, 7167);
     			attr_dev(div0, "id", "overlayText");
     			attr_dev(div0, "class", "svelte-c2nwl9");
-    			add_location(div0, file$3, 153, 4, 7425);
+    			add_location(div0, file$5, 153, 4, 7425);
     			attr_dev(div1, "id", "game-container");
     			attr_dev(div1, "style", /*spaceStyle*/ ctx[13]);
-    			add_location(div1, file$3, 150, 0, 7081);
+    			add_location(div1, file$5, 150, 0, 7081);
     		},
     		l: function claim(nodes) {
     			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -2027,8 +2032,8 @@ var app = (function () {
     				each_value = /*$targets*/ ctx[6];
     				validate_each_argument(each_value);
     				group_outros();
-    				validate_each_keys(ctx, each_value, get_each_context$1, get_key);
-    				each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div1, outro_and_destroy_block, create_each_block$1, t7, get_each_context$1);
+    				validate_each_keys(ctx, each_value, get_each_context$3, get_key);
+    				each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div1, outro_and_destroy_block, create_each_block$3, t7, get_each_context$3);
     				check_outros();
     			}
 
@@ -2040,7 +2045,7 @@ var app = (function () {
     						transition_in(if_block, 1);
     					}
     				} else {
-    					if_block = create_if_block$1(ctx);
+    					if_block = create_if_block$2(ctx);
     					if_block.c();
     					transition_in(if_block, 1);
     					if_block.m(div1, null);
@@ -2094,7 +2099,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_fragment$3.name,
+    		id: create_fragment$5.name,
     		type: "component",
     		source: "",
     		ctx
@@ -2103,7 +2108,7 @@ var app = (function () {
     	return block;
     }
 
-    function instance$3($$self, $$props, $$invalidate) {
+    function instance$5($$self, $$props, $$invalidate) {
     	let $dotPosition;
     	let $targets;
     	let { $$slots: slots = {}, $$scope } = $$props;
@@ -2264,7 +2269,7 @@ var app = (function () {
     	const writable_props = [];
 
     	Object.keys($$props).forEach(key => {
-    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$2.warn(`<MovingDotSpacePortfromReact> was created with unknown prop '${key}'`);
+    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$3.warn(`<MovingDotSpacePortfromReact> was created with unknown prop '${key}'`);
     	});
 
     	function canvas_1_binding($$value) {
@@ -2394,23 +2399,23 @@ var app = (function () {
     class MovingDotSpacePortfromReact extends SvelteComponentDev {
     	constructor(options) {
     		super(options);
-    		init(this, options, instance$3, create_fragment$3, safe_not_equal, {});
+    		init(this, options, instance$5, create_fragment$5, safe_not_equal, {});
 
     		dispatch_dev("SvelteRegisterComponent", {
     			component: this,
     			tagName: "MovingDotSpacePortfromReact",
     			options,
-    			id: create_fragment$3.name
+    			id: create_fragment$5.name
     		});
     	}
     }
 
     /* src\YoutubeIframeAPICustomInterface.svelte generated by Svelte v3.59.2 */
 
-    const { console: console_1$1 } = globals;
-    const file$2 = "src\\YoutubeIframeAPICustomInterface.svelte";
+    const { console: console_1$2 } = globals;
+    const file$4 = "src\\YoutubeIframeAPICustomInterface.svelte";
 
-    function create_fragment$2(ctx) {
+    function create_fragment$4(ctx) {
     	let h1;
     	let t1;
     	let label;
@@ -2558,53 +2563,53 @@ var app = (function () {
     			button7.textContent = "Export Round 2 Timestamps";
     			t50 = text(" Import Timestamps (Incomplete) ");
     			input2 = element("input");
-    			add_location(h1, file$2, 286, 0, 9769);
+    			add_location(h1, file$4, 286, 0, 9769);
     			attr_dev(input0, "type", "text");
-    			add_location(input0, file$2, 290, 4, 9927);
+    			add_location(input0, file$4, 290, 4, 9927);
     			attr_dev(input1, "type", "checkbox");
-    			add_location(input1, file$2, 292, 4, 10035);
-    			add_location(label, file$2, 288, 0, 9832);
+    			add_location(input1, file$4, 292, 4, 10035);
+    			add_location(label, file$4, 288, 0, 9832);
     			attr_dev(div0, "id", "youtube-player");
     			set_style(div0, "height", "90vh");
     			set_style(div0, "width", "90%");
-    			add_location(div0, file$2, 300, 4, 10405);
+    			add_location(div0, file$4, 300, 4, 10405);
     			set_style(div1, "position", "absolute");
     			set_style(div1, "top", "0%");
     			set_style(div1, "left", "40%");
     			set_style(div1, "color", "white");
     			set_style(div1, "background-color", "rgba(0, 0, 0, 0.5)");
-    			add_location(div1, file$2, 301, 4, 10475);
-    			add_location(br0, file$2, 305, 15, 10795);
+    			add_location(div1, file$4, 301, 4, 10475);
+    			add_location(br0, file$4, 305, 15, 10795);
     			set_style(div2, "position", "absolute");
     			set_style(div2, "top", "50%");
     			set_style(div2, "left", "20%");
     			set_style(div2, "color", "white");
     			set_style(div2, "background-color", "rgba(0, 0, 0, 0.5)");
     			set_style(div2, "font-size", "100px");
-    			add_location(div2, file$2, 304, 4, 10654);
+    			add_location(div2, file$4, 304, 4, 10654);
     			set_style(div3, "position", "relative");
-    			add_location(div3, file$2, 299, 0, 10366);
-    			add_location(button0, file$2, 311, 0, 10921);
-    			add_location(button1, file$2, 312, 0, 11014);
-    			add_location(br1, file$2, 315, 0, 11156);
-    			add_location(button2, file$2, 316, 0, 11162);
+    			add_location(div3, file$4, 299, 0, 10366);
+    			add_location(button0, file$4, 311, 0, 10921);
+    			add_location(button1, file$4, 312, 0, 11014);
+    			add_location(br1, file$4, 315, 0, 11156);
+    			add_location(button2, file$4, 316, 0, 11162);
     			attr_dev(button3, "class", button3_class_value = "" + (null_to_empty(/*currentindexButtonClass*/ ctx[10]) + " svelte-cpjgti"));
     			button3.disabled = button3_disabled_value = /*currentuserIndex*/ ctx[0] <= 0;
-    			add_location(button3, file$2, 317, 0, 11222);
+    			add_location(button3, file$4, 317, 0, 11222);
     			attr_dev(button4, "class", button4_class_value = "" + (null_to_empty(/*previousindexButtonClass*/ ctx[11]) + " svelte-cpjgti"));
     			button4.disabled = button4_disabled_value = /*currentuserIndex*/ ctx[0] <= 0;
-    			add_location(button4, file$2, 318, 0, 11377);
+    			add_location(button4, file$4, 318, 0, 11377);
     			attr_dev(button5, "class", button5_class_value = "" + (null_to_empty(/*nextindexButtonClass*/ ctx[12]) + " svelte-cpjgti"));
     			button5.disabled = button5_disabled_value = /*currentuserIndex*/ ctx[0] >= /*userTimestamps*/ ctx[1].length - 1;
-    			add_location(button5, file$2, 319, 0, 11522);
-    			add_location(br2, file$2, 322, 0, 11745);
-    			add_location(br3, file$2, 322, 82, 11827);
-    			add_location(br4, file$2, 322, 192, 11937);
-    			add_location(button6, file$2, 323, 0, 11943);
-    			add_location(button7, file$2, 323, 63, 12006);
+    			add_location(button5, file$4, 319, 0, 11522);
+    			add_location(br2, file$4, 322, 0, 11745);
+    			add_location(br3, file$4, 322, 82, 11827);
+    			add_location(br4, file$4, 322, 192, 11937);
+    			add_location(button6, file$4, 323, 0, 11943);
+    			add_location(button7, file$4, 323, 63, 12006);
     			attr_dev(input2, "type", "file");
     			attr_dev(input2, "accept", ".json");
-    			add_location(input2, file$2, 323, 167, 12110);
+    			add_location(input2, file$4, 323, 167, 12110);
     		},
     		l: function claim(nodes) {
     			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -2792,7 +2797,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_fragment$2.name,
+    		id: create_fragment$4.name,
     		type: "component",
     		source: "",
     		ctx
@@ -2806,7 +2811,7 @@ var app = (function () {
     	return words[Math.floor(Math.random() * words.length)];
     }
 
-    function instance$2($$self, $$props, $$invalidate) {
+    function instance$4($$self, $$props, $$invalidate) {
     	let nextindexButtonClass;
     	let previousindexButtonClass;
     	let currentindexButtonClass;
@@ -3096,7 +3101,7 @@ var app = (function () {
     	const writable_props = [];
 
     	Object.keys($$props).forEach(key => {
-    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$1.warn(`<YoutubeIframeAPICustomInterface> was created with unknown prop '${key}'`);
+    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$2.warn(`<YoutubeIframeAPICustomInterface> was created with unknown prop '${key}'`);
     	});
 
     	function input0_input_handler() {
@@ -3239,13 +3244,13 @@ var app = (function () {
     class YoutubeIframeAPICustomInterface extends SvelteComponentDev {
     	constructor(options) {
     		super(options);
-    		init(this, options, instance$2, create_fragment$2, safe_not_equal, {}, null, [-1, -1]);
+    		init(this, options, instance$4, create_fragment$4, safe_not_equal, {}, null, [-1, -1]);
 
     		dispatch_dev("SvelteRegisterComponent", {
     			component: this,
     			tagName: "YoutubeIframeAPICustomInterface",
     			options,
-    			id: create_fragment$2.name
+    			id: create_fragment$4.name
     		});
     	}
     }
@@ -3317,10 +3322,10 @@ var app = (function () {
 
     /* src\RecursiveNestedCommentsElement.svelte generated by Svelte v3.59.2 */
 
-    const { console: console_1 } = globals;
-    const file$1 = "src\\RecursiveNestedCommentsElement.svelte";
+    const { console: console_1$1 } = globals;
+    const file$3 = "src\\RecursiveNestedCommentsElement.svelte";
 
-    function get_each_context(ctx, list, i) {
+    function get_each_context$2(ctx, list, i) {
     	const child_ctx = ctx.slice();
     	child_ctx[14] = list[i];
     	child_ctx[15] = list;
@@ -3329,7 +3334,7 @@ var app = (function () {
     }
 
     // (123:16) {#if showReplyInput[comment.id]}
-    function create_if_block(ctx) {
+    function create_if_block$1(ctx) {
     	let div;
     	let input;
     	let t0;
@@ -3353,10 +3358,10 @@ var app = (function () {
     			button = element("button");
     			button.textContent = "Post Reply";
     			attr_dev(input, "placeholder", "Write a reply...");
-    			add_location(input, file$1, 124, 24, 4690);
-    			add_location(button, file$1, 125, 24, 4791);
+    			add_location(input, file$3, 124, 24, 4690);
+    			add_location(button, file$3, 125, 24, 4791);
     			attr_dev(div, "class", "reply-input");
-    			add_location(div, file$1, 123, 20, 4639);
+    			add_location(div, file$3, 123, 20, 4639);
     		},
     		m: function mount(target, anchor) {
     			insert_dev(target, div, anchor);
@@ -3390,7 +3395,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_if_block.name,
+    		id: create_if_block$1.name,
     		type: "if",
     		source: "(123:16) {#if showReplyInput[comment.id]}",
     		ctx
@@ -3400,7 +3405,7 @@ var app = (function () {
     }
 
     // (119:8) {#each flattenedComments as comment}
-    function create_each_block(ctx) {
+    function create_each_block$2(ctx) {
     	let div;
     	let span;
     	let t0_value = /*comment*/ ctx[14].title + "";
@@ -3417,7 +3422,7 @@ var app = (function () {
     		return /*click_handler*/ ctx[10](/*comment*/ ctx[14]);
     	}
 
-    	let if_block = /*showReplyInput*/ ctx[3][/*comment*/ ctx[14].id] && create_if_block(ctx);
+    	let if_block = /*showReplyInput*/ ctx[3][/*comment*/ ctx[14].id] && create_if_block$1(ctx);
 
     	const block = {
     		c: function create() {
@@ -3430,15 +3435,15 @@ var app = (function () {
     			t3 = space();
     			if (if_block) if_block.c();
     			t4 = space();
-    			add_location(span, file$1, 120, 16, 4453);
-    			add_location(button, file$1, 121, 16, 4499);
+    			add_location(span, file$3, 120, 16, 4453);
+    			add_location(button, file$3, 121, 16, 4499);
 
     			attr_dev(div, "class", div_class_value = "" + (null_to_empty(/*comment*/ ctx[14].level === 0
     			? 'top-level-comment'
     			: 'comment') + " svelte-bsj1sx"));
 
     			set_style(div, "margin-left", /*comment*/ ctx[14].level * 20 + "px");
-    			add_location(div, file$1, 119, 12, 4323);
+    			add_location(div, file$3, 119, 12, 4323);
     		},
     		m: function mount(target, anchor) {
     			insert_dev(target, div, anchor);
@@ -3463,7 +3468,7 @@ var app = (function () {
     				if (if_block) {
     					if_block.p(ctx, dirty);
     				} else {
-    					if_block = create_if_block(ctx);
+    					if_block = create_if_block$1(ctx);
     					if_block.c();
     					if_block.m(div, t4);
     				}
@@ -3492,7 +3497,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_each_block.name,
+    		id: create_each_block$2.name,
     		type: "each",
     		source: "(119:8) {#each flattenedComments as comment}",
     		ctx
@@ -3501,7 +3506,7 @@ var app = (function () {
     	return block;
     }
 
-    function create_fragment$1(ctx) {
+    function create_fragment$3(ctx) {
     	let h1;
     	let t1;
     	let h4;
@@ -3526,7 +3531,7 @@ var app = (function () {
     	let each_blocks = [];
 
     	for (let i = 0; i < each_value.length; i += 1) {
-    		each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i));
+    		each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i));
     	}
 
     	const block = {
@@ -3557,22 +3562,22 @@ var app = (function () {
     				each_blocks[i].c();
     			}
 
-    			add_location(h1, file$1, 104, 0, 3512);
-    			add_location(h4, file$1, 105, 0, 3614);
-    			add_location(button0, file$1, 108, 8, 3897);
+    			add_location(h1, file$3, 104, 0, 3512);
+    			add_location(h4, file$3, 105, 0, 3614);
+    			add_location(button0, file$3, 108, 8, 3897);
     			attr_dev(input0, "type", "file");
-    			add_location(input0, file$1, 110, 8, 4000);
+    			add_location(input0, file$3, 110, 8, 4000);
     			attr_dev(input1, "placeholder", "Add a comment...");
-    			add_location(input1, file$1, 112, 8, 4072);
-    			add_location(button1, file$1, 113, 8, 4146);
-    			add_location(div0, file$1, 107, 4, 3882);
-    			add_location(br, file$1, 116, 4, 4225);
+    			add_location(input1, file$3, 112, 8, 4072);
+    			add_location(button1, file$3, 113, 8, 4146);
+    			add_location(div0, file$3, 107, 4, 3882);
+    			add_location(br, file$3, 116, 4, 4225);
     			attr_dev(div1, "id", "comment-container");
-    			add_location(div1, file$1, 117, 4, 4235);
+    			add_location(div1, file$3, 117, 4, 4235);
     			attr_dev(div2, "class", "component-containter svelte-bsj1sx");
     			set_style(div2, "border", "1px solid black");
     			set_style(div2, "padding", "4px");
-    			add_location(div2, file$1, 106, 0, 3795);
+    			add_location(div2, file$3, 106, 0, 3795);
     		},
     		l: function claim(nodes) {
     			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
@@ -3625,12 +3630,12 @@ var app = (function () {
     				let i;
 
     				for (i = 0; i < each_value.length; i += 1) {
-    					const child_ctx = get_each_context(ctx, each_value, i);
+    					const child_ctx = get_each_context$2(ctx, each_value, i);
 
     					if (each_blocks[i]) {
     						each_blocks[i].p(child_ctx, dirty);
     					} else {
-    						each_blocks[i] = create_each_block(child_ctx);
+    						each_blocks[i] = create_each_block$2(child_ctx);
     						each_blocks[i].c();
     						each_blocks[i].m(div1, null);
     					}
@@ -3659,7 +3664,7 @@ var app = (function () {
 
     	dispatch_dev("SvelteRegisterBlock", {
     		block,
-    		id: create_fragment$1.name,
+    		id: create_fragment$3.name,
     		type: "component",
     		source: "",
     		ctx
@@ -3685,7 +3690,7 @@ var app = (function () {
     	return result;
     }
 
-    function instance$1($$self, $$props, $$invalidate) {
+    function instance$3($$self, $$props, $$invalidate) {
     	let { $$slots: slots = {}, $$scope } = $$props;
     	validate_slots('RecursiveNestedCommentsElement', slots, []);
     	let comments = [];
@@ -3770,7 +3775,7 @@ var app = (function () {
     	const writable_props = [];
 
     	Object.keys($$props).forEach(key => {
-    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1.warn(`<RecursiveNestedCommentsElement> was created with unknown prop '${key}'`);
+    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$1.warn(`<RecursiveNestedCommentsElement> was created with unknown prop '${key}'`);
     	});
 
     	function input1_input_handler() {
@@ -3837,114 +3842,797 @@ var app = (function () {
     class RecursiveNestedCommentsElement extends SvelteComponentDev {
     	constructor(options) {
     		super(options);
-    		init(this, options, instance$1, create_fragment$1, safe_not_equal, {});
+    		init(this, options, instance$3, create_fragment$3, safe_not_equal, {});
 
     		dispatch_dev("SvelteRegisterComponent", {
     			component: this,
     			tagName: "RecursiveNestedCommentsElement",
     			options,
-    			id: create_fragment$1.name
+    			id: create_fragment$3.name
     		});
     	}
     }
 
-    /* src\App.svelte generated by Svelte v3.59.2 */
-    const file = "src\\App.svelte";
+    /* src\CopyandRemoveListComponent.svelte generated by Svelte v3.59.2 */
 
-    function create_fragment(ctx) {
-    	let main;
-    	let h10;
-    	let t0;
-    	let t1;
-    	let t2;
-    	let t3;
+    const { console: console_1 } = globals;
+    const file$2 = "src\\CopyandRemoveListComponent.svelte";
+
+    function get_each_context$1(ctx, list, i) {
+    	const child_ctx = ctx.slice();
+    	child_ctx[6] = list[i];
+    	return child_ctx;
+    }
+
+    // (26:0) {:else}
+    function create_else_block(ctx) {
+    	let each_blocks = [];
+    	let each_1_lookup = new Map();
+    	let each_1_anchor;
+    	let each_value = /*items*/ ctx[1];
+    	validate_each_argument(each_value);
+    	const get_key = ctx => /*item*/ ctx[6].id;
+    	validate_each_keys(ctx, each_value, get_each_context$1, get_key);
+
+    	for (let i = 0; i < each_value.length; i += 1) {
+    		let child_ctx = get_each_context$1(ctx, each_value, i);
+    		let key = get_key(child_ctx);
+    		each_1_lookup.set(key, each_blocks[i] = create_each_block$1(key, child_ctx));
+    	}
+
+    	const block = {
+    		c: function create() {
+    			for (let i = 0; i < each_blocks.length; i += 1) {
+    				each_blocks[i].c();
+    			}
+
+    			each_1_anchor = empty();
+    		},
+    		m: function mount(target, anchor) {
+    			for (let i = 0; i < each_blocks.length; i += 1) {
+    				if (each_blocks[i]) {
+    					each_blocks[i].m(target, anchor);
+    				}
+    			}
+
+    			insert_dev(target, each_1_anchor, anchor);
+    		},
+    		p: function update(ctx, dirty) {
+    			if (dirty & /*copyAndRemoveItem, items*/ 10) {
+    				each_value = /*items*/ ctx[1];
+    				validate_each_argument(each_value);
+    				validate_each_keys(ctx, each_value, get_each_context$1, get_key);
+    				each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, destroy_block, create_each_block$1, each_1_anchor, get_each_context$1);
+    			}
+    		},
+    		d: function destroy(detaching) {
+    			for (let i = 0; i < each_blocks.length; i += 1) {
+    				each_blocks[i].d(detaching);
+    			}
+
+    			if (detaching) detach_dev(each_1_anchor);
+    		}
+    	};
+
+    	dispatch_dev("SvelteRegisterBlock", {
+    		block,
+    		id: create_else_block.name,
+    		type: "else",
+    		source: "(26:0) {:else}",
+    		ctx
+    	});
+
+    	return block;
+    }
+
+    // (24:0) {#if items.length === 0}
+    function create_if_block(ctx) {
     	let p;
-    	let t4;
-    	let a;
-    	let t6;
-    	let t7;
-    	let h11;
-    	let t9;
-    	let h3;
-    	let t11;
-    	let nestedcommentssvelte;
-    	let t12;
-    	let myyoutube;
-    	let t13;
-    	let h12;
-    	let t15;
-    	let dotgame;
-    	let current;
-    	nestedcommentssvelte = new RecursiveNestedCommentsElement({ $$inline: true });
-    	myyoutube = new YoutubeIframeAPICustomInterface({ $$inline: true });
-    	dotgame = new MovingDotSpacePortfromReact({ $$inline: true });
 
     	const block = {
     		c: function create() {
-    			main = element("main");
-    			h10 = element("h1");
-    			t0 = text("Hello ");
-    			t1 = text(/*name*/ ctx[0]);
-    			t2 = text("!");
-    			t3 = space();
     			p = element("p");
-    			t4 = text("Visit the ");
-    			a = element("a");
-    			a.textContent = "Svelte tutorial";
-    			t6 = text(" to learn how to build Svelte apps.");
-    			t7 = space();
-    			h11 = element("h1");
-    			h11.textContent = "Brainstorm for Educational Interfaces to add LLM and other models into";
-    			t9 = space();
-    			h3 = element("h3");
-    			h3.textContent = "(Through Gradio and Custom Components)";
-    			t11 = space();
-    			create_component(nestedcommentssvelte.$$.fragment);
-    			t12 = space();
-    			create_component(myyoutube.$$.fragment);
-    			t13 = space();
-    			h12 = element("h1");
-    			h12.textContent = "Themeable Game Brainstorm - Image + Lists";
-    			t15 = space();
-    			create_component(dotgame.$$.fragment);
-    			attr_dev(h10, "class", "svelte-1tky8bj");
-    			add_location(h10, file, 21, 1, 467);
-    			attr_dev(a, "href", "https://svelte.dev/tutorial");
-    			add_location(a, file, 22, 14, 504);
-    			add_location(p, file, 22, 1, 491);
-    			attr_dev(h11, "class", "svelte-1tky8bj");
-    			add_location(h11, file, 24, 1, 603);
-    			add_location(h3, file, 25, 1, 686);
-    			attr_dev(h12, "class", "svelte-1tky8bj");
-    			add_location(h12, file, 32, 1, 830);
-    			attr_dev(main, "class", "svelte-1tky8bj");
-    			add_location(main, file, 19, 0, 458);
+    			p.textContent = "All items have been copied! (or none entered yet)";
+    			add_location(p, file$2, 24, 4, 732);
     		},
-    		l: function claim(nodes) {
-    			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+    		m: function mount(target, anchor) {
+    			insert_dev(target, p, anchor);
+    		},
+    		p: noop,
+    		d: function destroy(detaching) {
+    			if (detaching) detach_dev(p);
+    		}
+    	};
+
+    	dispatch_dev("SvelteRegisterBlock", {
+    		block,
+    		id: create_if_block.name,
+    		type: "if",
+    		source: "(24:0) {#if items.length === 0}",
+    		ctx
+    	});
+
+    	return block;
+    }
+
+    // (27:4) {#each items as item (item.id)}
+    function create_each_block$1(key_1, ctx) {
+    	let button;
+    	let t0_value = /*item*/ ctx[6].text + "";
+    	let t0;
+    	let t1;
+    	let mounted;
+    	let dispose;
+
+    	function click_handler() {
+    		return /*click_handler*/ ctx[5](/*item*/ ctx[6]);
+    	}
+
+    	const block = {
+    		key: key_1,
+    		first: null,
+    		c: function create() {
+    			button = element("button");
+    			t0 = text(t0_value);
+    			t1 = space();
+    			attr_dev(button, "class", "item svelte-bmbf24");
+    			add_location(button, file$2, 27, 8, 844);
+    			this.first = button;
     		},
     		m: function mount(target, anchor) {
-    			insert_dev(target, main, anchor);
-    			append_dev(main, h10);
-    			append_dev(h10, t0);
-    			append_dev(h10, t1);
-    			append_dev(h10, t2);
-    			append_dev(main, t3);
-    			append_dev(main, p);
-    			append_dev(p, t4);
-    			append_dev(p, a);
-    			append_dev(p, t6);
-    			append_dev(main, t7);
+    			insert_dev(target, button, anchor);
+    			append_dev(button, t0);
+    			append_dev(button, t1);
+
+    			if (!mounted) {
+    				dispose = listen_dev(button, "click", click_handler, false, false, false, false);
+    				mounted = true;
+    			}
+    		},
+    		p: function update(new_ctx, dirty) {
+    			ctx = new_ctx;
+    			if (dirty & /*items*/ 2 && t0_value !== (t0_value = /*item*/ ctx[6].text + "")) set_data_dev(t0, t0_value);
+    		},
+    		d: function destroy(detaching) {
+    			if (detaching) detach_dev(button);
+    			mounted = false;
+    			dispose();
+    		}
+    	};
+
+    	dispatch_dev("SvelteRegisterBlock", {
+    		block,
+    		id: create_each_block$1.name,
+    		type: "each",
+    		source: "(27:4) {#each items as item (item.id)}",
+    		ctx
+    	});
+
+    	return block;
+    }
+
+    function create_fragment$2(ctx) {
+    	let h1;
+    	let t1;
+    	let textarea;
+    	let t2;
+    	let if_block_anchor;
+    	let mounted;
+    	let dispose;
+
+    	function select_block_type(ctx, dirty) {
+    		if (/*items*/ ctx[1].length === 0) return create_if_block;
+    		return create_else_block;
+    	}
+
+    	let current_block_type = select_block_type(ctx);
+    	let if_block = current_block_type(ctx);
+
+    	const block = {
+    		c: function create() {
+    			h1 = element("h1");
+    			h1.textContent = "Copy items for prompts by clicking buttons below";
+    			t1 = space();
+    			textarea = element("textarea");
+    			t2 = space();
+    			if_block.c();
+    			if_block_anchor = empty();
+    			add_location(h1, file$2, 19, 0, 537);
+    			attr_dev(textarea, "placeholder", "Enter text here...");
+    			attr_dev(textarea, "class", "svelte-bmbf24");
+    			add_location(textarea, file$2, 21, 0, 598);
+    		},
+    		l: function claim(nodes) {
+    			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+    		},
+    		m: function mount(target, anchor) {
+    			insert_dev(target, h1, anchor);
+    			insert_dev(target, t1, anchor);
+    			insert_dev(target, textarea, anchor);
+    			set_input_value(textarea, /*textInput*/ ctx[0]);
+    			insert_dev(target, t2, anchor);
+    			if_block.m(target, anchor);
+    			insert_dev(target, if_block_anchor, anchor);
+
+    			if (!mounted) {
+    				dispose = [
+    					listen_dev(textarea, "input", /*textarea_input_handler*/ ctx[4]),
+    					listen_dev(textarea, "input", /*updateItems*/ ctx[2], false, false, false, false)
+    				];
+
+    				mounted = true;
+    			}
+    		},
+    		p: function update(ctx, [dirty]) {
+    			if (dirty & /*textInput*/ 1) {
+    				set_input_value(textarea, /*textInput*/ ctx[0]);
+    			}
+
+    			if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block) {
+    				if_block.p(ctx, dirty);
+    			} else {
+    				if_block.d(1);
+    				if_block = current_block_type(ctx);
+
+    				if (if_block) {
+    					if_block.c();
+    					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+    				}
+    			}
+    		},
+    		i: noop,
+    		o: noop,
+    		d: function destroy(detaching) {
+    			if (detaching) detach_dev(h1);
+    			if (detaching) detach_dev(t1);
+    			if (detaching) detach_dev(textarea);
+    			if (detaching) detach_dev(t2);
+    			if_block.d(detaching);
+    			if (detaching) detach_dev(if_block_anchor);
+    			mounted = false;
+    			run_all(dispose);
+    		}
+    	};
+
+    	dispatch_dev("SvelteRegisterBlock", {
+    		block,
+    		id: create_fragment$2.name,
+    		type: "component",
+    		source: "",
+    		ctx
+    	});
+
+    	return block;
+    }
+
+    function instance$2($$self, $$props, $$invalidate) {
+    	let { $$slots: slots = {}, $$scope } = $$props;
+    	validate_slots('CopyandRemoveListComponent', slots, []);
+    	let textInput = '';
+    	let items = [];
+
+    	function updateItems() {
+    		$$invalidate(1, items = textInput.split('\n').filter(line => line.trim() !== '').map((line, index) => ({ id: index + line, text: line })));
+    	}
+
+    	async function copyAndRemoveItem(item) {
+    		try {
+    			await navigator.clipboard.writeText(item.text);
+    			$$invalidate(1, items = items.filter(i => i.id !== item.id));
+    		} catch(err) {
+    			console.error('Failed to copy text: ', err);
+    		}
+    	}
+
+    	const writable_props = [];
+
+    	Object.keys($$props).forEach(key => {
+    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1.warn(`<CopyandRemoveListComponent> was created with unknown prop '${key}'`);
+    	});
+
+    	function textarea_input_handler() {
+    		textInput = this.value;
+    		$$invalidate(0, textInput);
+    	}
+
+    	const click_handler = item => copyAndRemoveItem(item);
+
+    	$$self.$capture_state = () => ({
+    		textInput,
+    		items,
+    		updateItems,
+    		copyAndRemoveItem
+    	});
+
+    	$$self.$inject_state = $$props => {
+    		if ('textInput' in $$props) $$invalidate(0, textInput = $$props.textInput);
+    		if ('items' in $$props) $$invalidate(1, items = $$props.items);
+    	};
+
+    	if ($$props && "$$inject" in $$props) {
+    		$$self.$inject_state($$props.$$inject);
+    	}
+
+    	return [
+    		textInput,
+    		items,
+    		updateItems,
+    		copyAndRemoveItem,
+    		textarea_input_handler,
+    		click_handler
+    	];
+    }
+
+    class CopyandRemoveListComponent extends SvelteComponentDev {
+    	constructor(options) {
+    		super(options);
+    		init(this, options, instance$2, create_fragment$2, safe_not_equal, {});
+
+    		dispatch_dev("SvelteRegisterComponent", {
+    			component: this,
+    			tagName: "CopyandRemoveListComponent",
+    			options,
+    			id: create_fragment$2.name
+    		});
+    	}
+    }
+
+    /* src\ReadingStateCounter.svelte generated by Svelte v3.59.2 */
+
+    const file$1 = "src\\ReadingStateCounter.svelte";
+
+    function get_each_context(ctx, list, i) {
+    	const child_ctx = ctx.slice();
+    	child_ctx[8] = list[i];
+    	child_ctx[10] = i;
+    	return child_ctx;
+    }
+
+    // (66:4) {#each words as wordObj, index (wordObj.word)}
+    function create_each_block(key_1, ctx) {
+    	let button;
+    	let t0_value = /*wordObj*/ ctx[8].word + "";
+    	let t0;
+    	let t1;
+    	let t2_value = /*wordObj*/ ctx[8].count + "";
+    	let t2;
+    	let t3;
+    	let mounted;
+    	let dispose;
+
+    	function click_handler() {
+    		return /*click_handler*/ ctx[7](/*index*/ ctx[10]);
+    	}
+
+    	const block = {
+    		key: key_1,
+    		first: null,
+    		c: function create() {
+    			button = element("button");
+    			t0 = text(t0_value);
+    			t1 = text(" (");
+    			t2 = text(t2_value);
+    			t3 = text(")\r\n        ");
+    			attr_dev(button, "class", "word-button svelte-13vjncp");
+    			set_style(button, "background-color", getColor(/*wordObj*/ ctx[8].count));
+    			add_location(button, file$1, 66, 8, 1940);
+    			this.first = button;
+    		},
+    		m: function mount(target, anchor) {
+    			insert_dev(target, button, anchor);
+    			append_dev(button, t0);
+    			append_dev(button, t1);
+    			append_dev(button, t2);
+    			append_dev(button, t3);
+
+    			if (!mounted) {
+    				dispose = listen_dev(button, "click", click_handler, false, false, false, false);
+    				mounted = true;
+    			}
+    		},
+    		p: function update(new_ctx, dirty) {
+    			ctx = new_ctx;
+    			if (dirty & /*words*/ 2 && t0_value !== (t0_value = /*wordObj*/ ctx[8].word + "")) set_data_dev(t0, t0_value);
+    			if (dirty & /*words*/ 2 && t2_value !== (t2_value = /*wordObj*/ ctx[8].count + "")) set_data_dev(t2, t2_value);
+
+    			if (dirty & /*words*/ 2) {
+    				set_style(button, "background-color", getColor(/*wordObj*/ ctx[8].count));
+    			}
+    		},
+    		d: function destroy(detaching) {
+    			if (detaching) detach_dev(button);
+    			mounted = false;
+    			dispose();
+    		}
+    	};
+
+    	dispatch_dev("SvelteRegisterBlock", {
+    		block,
+    		id: create_each_block.name,
+    		type: "each",
+    		source: "(66:4) {#each words as wordObj, index (wordObj.word)}",
+    		ctx
+    	});
+
+    	return block;
+    }
+
+    function create_fragment$1(ctx) {
+    	let div0;
+    	let h1;
+    	let t1;
+    	let input0;
+    	let t2;
+    	let button0;
+    	let t4;
+    	let button1;
+    	let t6;
+    	let input1;
+    	let t7;
+    	let div1;
+    	let each_blocks = [];
+    	let each_1_lookup = new Map();
+    	let mounted;
+    	let dispose;
+    	let each_value = /*words*/ ctx[1];
+    	validate_each_argument(each_value);
+    	const get_key = ctx => /*wordObj*/ ctx[8].word;
+    	validate_each_keys(ctx, each_value, get_each_context, get_key);
+
+    	for (let i = 0; i < each_value.length; i += 1) {
+    		let child_ctx = get_each_context(ctx, each_value, i);
+    		let key = get_key(child_ctx);
+    		each_1_lookup.set(key, each_blocks[i] = create_each_block(key, child_ctx));
+    	}
+
+    	const block = {
+    		c: function create() {
+    			div0 = element("div");
+    			h1 = element("h1");
+    			h1.textContent = "Stateful Reader Brainstorm";
+    			t1 = space();
+    			input0 = element("input");
+    			t2 = space();
+    			button0 = element("button");
+    			button0.textContent = "Submit Text";
+    			t4 = space();
+    			button1 = element("button");
+    			button1.textContent = "Export to JSON";
+    			t6 = space();
+    			input1 = element("input");
+    			t7 = space();
+    			div1 = element("div");
+
+    			for (let i = 0; i < each_blocks.length; i += 1) {
+    				each_blocks[i].c();
+    			}
+
+    			add_location(h1, file$1, 57, 4, 1576);
+    			attr_dev(input0, "type", "text");
+    			attr_dev(input0, "placeholder", "Enter text here");
+    			attr_dev(input0, "class", "svelte-13vjncp");
+    			add_location(input0, file$1, 58, 4, 1617);
+    			attr_dev(button0, "class", "svelte-13vjncp");
+    			add_location(button0, file$1, 59, 4, 1696);
+    			attr_dev(button1, "class", "svelte-13vjncp");
+    			add_location(button1, file$1, 60, 4, 1752);
+    			attr_dev(input1, "type", "file");
+    			attr_dev(input1, "class", "svelte-13vjncp");
+    			add_location(input1, file$1, 61, 4, 1813);
+    			add_location(div0, file$1, 56, 0, 1565);
+    			add_location(div1, file$1, 64, 0, 1873);
+    		},
+    		l: function claim(nodes) {
+    			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+    		},
+    		m: function mount(target, anchor) {
+    			insert_dev(target, div0, anchor);
+    			append_dev(div0, h1);
+    			append_dev(div0, t1);
+    			append_dev(div0, input0);
+    			set_input_value(input0, /*inputText*/ ctx[0]);
+    			append_dev(div0, t2);
+    			append_dev(div0, button0);
+    			append_dev(div0, t4);
+    			append_dev(div0, button1);
+    			append_dev(div0, t6);
+    			append_dev(div0, input1);
+    			insert_dev(target, t7, anchor);
+    			insert_dev(target, div1, anchor);
+
+    			for (let i = 0; i < each_blocks.length; i += 1) {
+    				if (each_blocks[i]) {
+    					each_blocks[i].m(div1, null);
+    				}
+    			}
+
+    			if (!mounted) {
+    				dispose = [
+    					listen_dev(input0, "input", /*input0_input_handler*/ ctx[6]),
+    					listen_dev(button0, "click", /*submitText*/ ctx[2], false, false, false, false),
+    					listen_dev(button1, "click", /*exportToJson*/ ctx[4], false, false, false, false),
+    					listen_dev(input1, "change", /*importFromJson*/ ctx[5], false, false, false, false)
+    				];
+
+    				mounted = true;
+    			}
+    		},
+    		p: function update(ctx, [dirty]) {
+    			if (dirty & /*inputText*/ 1 && input0.value !== /*inputText*/ ctx[0]) {
+    				set_input_value(input0, /*inputText*/ ctx[0]);
+    			}
+
+    			if (dirty & /*getColor, words, handleClick*/ 10) {
+    				each_value = /*words*/ ctx[1];
+    				validate_each_argument(each_value);
+    				validate_each_keys(ctx, each_value, get_each_context, get_key);
+    				each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div1, destroy_block, create_each_block, null, get_each_context);
+    			}
+    		},
+    		i: noop,
+    		o: noop,
+    		d: function destroy(detaching) {
+    			if (detaching) detach_dev(div0);
+    			if (detaching) detach_dev(t7);
+    			if (detaching) detach_dev(div1);
+
+    			for (let i = 0; i < each_blocks.length; i += 1) {
+    				each_blocks[i].d();
+    			}
+
+    			mounted = false;
+    			run_all(dispose);
+    		}
+    	};
+
+    	dispatch_dev("SvelteRegisterBlock", {
+    		block,
+    		id: create_fragment$1.name,
+    		type: "component",
+    		source: "",
+    		ctx
+    	});
+
+    	return block;
+    }
+
+    function getColor(count) {
+    	const colors = [
+    		'#1a1a1a',
+    		'#333333',
+    		'#4d4d4d',
+    		'#666666',
+    		'#808080',
+    		'#999999',
+    		'#b3b3b3',
+    		'#cccccc',
+    		'#e6e6e6',
+    		'#ffffff'
+    	];
+
+    	return colors[Math.min(Math.floor(count / 10), 9)];
+    }
+
+    function instance$1($$self, $$props, $$invalidate) {
+    	let { $$slots: slots = {}, $$scope } = $$props;
+    	validate_slots('ReadingStateCounter', slots, []);
+    	let inputText = "";
+    	let words = [];
+
+    	function submitText() {
+    		$$invalidate(1, words = inputText.split(/\s+/).map(word => ({ word, count: 0 })));
+    	}
+
+    	function handleClick(index) {
+    		$$invalidate(1, words[index].count += 1, words);
+    		$$invalidate(1, words = [...words]); // Ensures Svelte detects the change
+    	}
+
+    	// Function to export data to JSON
+    	function exportToJson() {
+    		const jsonData = JSON.stringify(words);
+    		const blob = new Blob([jsonData], { type: "application/json" });
+    		const url = URL.createObjectURL(blob);
+    		const a = document.createElement('a');
+    		a.href = url;
+    		a.download = 'statefulwords.json';
+    		a.click();
+    		URL.revokeObjectURL(url);
+    	}
+
+    	// Function to handle file import
+    	function importFromJson(event) {
+    		const file = event.target.files[0];
+
+    		if (file) {
+    			const reader = new FileReader();
+
+    			reader.onload = e => {
+    				const json = e.target.result;
+    				$$invalidate(1, words = JSON.parse(json));
+    			};
+
+    			reader.readAsText(file);
+    		}
+    	}
+
+    	const writable_props = [];
+
+    	Object.keys($$props).forEach(key => {
+    		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<ReadingStateCounter> was created with unknown prop '${key}'`);
+    	});
+
+    	function input0_input_handler() {
+    		inputText = this.value;
+    		$$invalidate(0, inputText);
+    	}
+
+    	const click_handler = index => handleClick(index);
+
+    	$$self.$capture_state = () => ({
+    		inputText,
+    		words,
+    		submitText,
+    		handleClick,
+    		getColor,
+    		exportToJson,
+    		importFromJson
+    	});
+
+    	$$self.$inject_state = $$props => {
+    		if ('inputText' in $$props) $$invalidate(0, inputText = $$props.inputText);
+    		if ('words' in $$props) $$invalidate(1, words = $$props.words);
+    	};
+
+    	if ($$props && "$$inject" in $$props) {
+    		$$self.$inject_state($$props.$$inject);
+    	}
+
+    	return [
+    		inputText,
+    		words,
+    		submitText,
+    		handleClick,
+    		exportToJson,
+    		importFromJson,
+    		input0_input_handler,
+    		click_handler
+    	];
+    }
+
+    class ReadingStateCounter extends SvelteComponentDev {
+    	constructor(options) {
+    		super(options);
+    		init(this, options, instance$1, create_fragment$1, safe_not_equal, {});
+
+    		dispatch_dev("SvelteRegisterComponent", {
+    			component: this,
+    			tagName: "ReadingStateCounter",
+    			options,
+    			id: create_fragment$1.name
+    		});
+    	}
+    }
+
+    /* src\App.svelte generated by Svelte v3.59.2 */
+    const file = "src\\App.svelte";
+
+    function create_fragment(ctx) {
+    	let main;
+    	let h10;
+    	let t0;
+    	let t1;
+    	let t2;
+    	let t3;
+    	let p;
+    	let t4;
+    	let a;
+    	let t6;
+    	let t7;
+    	let h11;
+    	let t9;
+    	let h30;
+    	let t11;
+    	let h31;
+    	let t13;
+    	let readingstatecounter;
+    	let t14;
+    	let copyremove;
+    	let t15;
+    	let nestedcommentssvelte;
+    	let t16;
+    	let myyoutube;
+    	let t17;
+    	let h12;
+    	let t19;
+    	let dotgame;
+    	let current;
+    	readingstatecounter = new ReadingStateCounter({ $$inline: true });
+    	copyremove = new CopyandRemoveListComponent({ $$inline: true });
+    	nestedcommentssvelte = new RecursiveNestedCommentsElement({ $$inline: true });
+    	myyoutube = new YoutubeIframeAPICustomInterface({ $$inline: true });
+    	dotgame = new MovingDotSpacePortfromReact({ $$inline: true });
+
+    	const block = {
+    		c: function create() {
+    			main = element("main");
+    			h10 = element("h1");
+    			t0 = text("Hello ");
+    			t1 = text(/*name*/ ctx[0]);
+    			t2 = text("!");
+    			t3 = space();
+    			p = element("p");
+    			t4 = text("Visit the ");
+    			a = element("a");
+    			a.textContent = "Svelte tutorial";
+    			t6 = text(" to learn how to build Svelte apps.");
+    			t7 = space();
+    			h11 = element("h1");
+    			h11.textContent = "Brainstorm for Educational Interfaces to add LLM and other models into";
+    			t9 = space();
+    			h30 = element("h3");
+    			h30.textContent = "(Through Gradio and Custom Components)";
+    			t11 = space();
+    			h31 = element("h3");
+    			h31.textContent = "Gradio client Test in another space due to incompatabilitiess with default svelte and @gradio/client";
+    			t13 = space();
+    			create_component(readingstatecounter.$$.fragment);
+    			t14 = space();
+    			create_component(copyremove.$$.fragment);
+    			t15 = space();
+    			create_component(nestedcommentssvelte.$$.fragment);
+    			t16 = space();
+    			create_component(myyoutube.$$.fragment);
+    			t17 = space();
+    			h12 = element("h1");
+    			h12.textContent = "Themeable Game Brainstorm - Image + Lists";
+    			t19 = space();
+    			create_component(dotgame.$$.fragment);
+    			attr_dev(h10, "class", "svelte-1tky8bj");
+    			add_location(h10, file, 24, 1, 651);
+    			attr_dev(a, "href", "https://svelte.dev/tutorial");
+    			add_location(a, file, 25, 14, 688);
+    			add_location(p, file, 25, 1, 675);
+    			attr_dev(h11, "class", "svelte-1tky8bj");
+    			add_location(h11, file, 27, 1, 787);
+    			add_location(h30, file, 28, 1, 870);
+    			add_location(h31, file, 30, 1, 922);
+    			attr_dev(h12, "class", "svelte-1tky8bj");
+    			add_location(h12, file, 41, 1, 1170);
+    			attr_dev(main, "class", "svelte-1tky8bj");
+    			add_location(main, file, 22, 0, 642);
+    		},
+    		l: function claim(nodes) {
+    			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+    		},
+    		m: function mount(target, anchor) {
+    			insert_dev(target, main, anchor);
+    			append_dev(main, h10);
+    			append_dev(h10, t0);
+    			append_dev(h10, t1);
+    			append_dev(h10, t2);
+    			append_dev(main, t3);
+    			append_dev(main, p);
+    			append_dev(p, t4);
+    			append_dev(p, a);
+    			append_dev(p, t6);
+    			append_dev(main, t7);
     			append_dev(main, h11);
     			append_dev(main, t9);
-    			append_dev(main, h3);
+    			append_dev(main, h30);
     			append_dev(main, t11);
+    			append_dev(main, h31);
+    			append_dev(main, t13);
+    			mount_component(readingstatecounter, main, null);
+    			append_dev(main, t14);
+    			mount_component(copyremove, main, null);
+    			append_dev(main, t15);
     			mount_component(nestedcommentssvelte, main, null);
-    			append_dev(main, t12);
+    			append_dev(main, t16);
     			mount_component(myyoutube, main, null);
-    			append_dev(main, t13);
+    			append_dev(main, t17);
     			append_dev(main, h12);
-    			append_dev(main, t15);
+    			append_dev(main, t19);
     			mount_component(dotgame, main, null);
     			current = true;
     		},
@@ -3953,12 +4641,16 @@ var app = (function () {
     		},
     		i: function intro(local) {
     			if (current) return;
+    			transition_in(readingstatecounter.$$.fragment, local);
+    			transition_in(copyremove.$$.fragment, local);
     			transition_in(nestedcommentssvelte.$$.fragment, local);
     			transition_in(myyoutube.$$.fragment, local);
     			transition_in(dotgame.$$.fragment, local);
     			current = true;
     		},
     		o: function outro(local) {
+    			transition_out(readingstatecounter.$$.fragment, local);
+    			transition_out(copyremove.$$.fragment, local);
     			transition_out(nestedcommentssvelte.$$.fragment, local);
     			transition_out(myyoutube.$$.fragment, local);
     			transition_out(dotgame.$$.fragment, local);
@@ -3966,6 +4658,8 @@ var app = (function () {
     		},
     		d: function destroy(detaching) {
     			if (detaching) detach_dev(main);
+    			destroy_component(readingstatecounter);
+    			destroy_component(copyremove);
     			destroy_component(nestedcommentssvelte);
     			destroy_component(myyoutube);
     			destroy_component(dotgame);
@@ -4019,6 +4713,9 @@ var app = (function () {
     		DotGame: MovingDotSpacePortfromReact,
     		MyYoutube: YoutubeIframeAPICustomInterface,
     		NestedCommentsSvelte: RecursiveNestedCommentsElement,
+    		CopyRemove: CopyandRemoveListComponent,
+    		ReadingState: ReadingStateCounter,
+    		ReadingStateCounter,
     		showModal,
     		openModal,
     		closeModal