@realsee/dnalogel 2.1.0-alpha.11 → 2.1.0-alpha.12

package/dist/PanoTagPlugin/index.js

@@ -11,6 +11,10 @@ var transition = require('svelte/transition');
 var anime = require('animejs');
 var svelte = require('svelte');
 var easing = require('svelte/easing');
+var svelte$1 = require('swiper/svelte');
+var swiper = require('swiper');
+require('swiper/css');
+require('swiper/css/autoplay');
 var CSS3DRenderer = require('three/examples/jsm/renderers/CSS3DRenderer');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -303,12 +307,12 @@ function uuid() {
 
 /* src/PanoTagPlugin/Components/Common/Line/Straight.svelte generated by Svelte v3.50.1 */
 
-function add_css$k(target) {
+function add_css$l(target) {
 	internal.append_styles(target, "svelte-1omzoh4", ".straight-line.svelte-1omzoh4{display:block;width:100%;height:100%;overflow:visible}");
 }
 
 // (17:2) {#if unfolded}
-function create_if_block$g(ctx) {
+function create_if_block$h(ctx) {
 	let path;
 	let path_intro;
 	let path_outro;
@@ -366,13 +370,13 @@ function create_if_block$g(ctx) {
 	};
 }
 
-function create_fragment$k(ctx) {
+function create_fragment$l(ctx) {
 	let svg;
 	let defs;
 	let linearGradient;
 	let stop0;
 	let stop1;
-	let if_block = /*unfolded*/ ctx[3] && create_if_block$g(ctx);
+	let if_block = /*unfolded*/ ctx[3] && create_if_block$h(ctx);
 
 	return {
 		c() {
@@ -411,7 +415,7 @@ function create_fragment$k(ctx) {
 						internal.transition_in(if_block, 1);
 					}
 				} else {
-					if_block = create_if_block$g(ctx);
+					if_block = create_if_block$h(ctx);
 					if_block.c();
 					internal.transition_in(if_block, 1);
 					if_block.m(svg, null);
@@ -439,7 +443,7 @@ function create_fragment$k(ctx) {
 	};
 }
 
-function instance$k($$self, $$props, $$invalidate) {
+function instance$l($$self, $$props, $$invalidate) {
 	let { inDelay = 0 } = $$props;
 	let { duration = 0 } = $$props;
 	let { outDelay = 0 } = $$props;
@@ -463,8 +467,8 @@ class Straight extends internal.SvelteComponent {
 		internal.init(
 			this,
 			options,
-			instance$k,
-			create_fragment$k,
+			instance$l,
+			create_fragment$l,
 			internal.safe_not_equal,
 			{
 				inDelay: 0,
@@ -472,19 +476,19 @@ class Straight extends internal.SvelteComponent {
 				outDelay: 2,
 				unfolded: 3
 			},
-			add_css$k
+			add_css$l
 		);
 	}
 }
 
 /* src/PanoTagPlugin/Components/Common/Shadow.svelte generated by Svelte v3.50.1 */
 
-function add_css$j(target) {
+function add_css$k(target) {
 	internal.append_styles(target, "svelte-faoauy", ".shadow.svelte-faoauy{position:absolute}");
 }
 
 // (23:0) {#if visible}
-function create_if_block$f(ctx) {
+function create_if_block$g(ctx) {
 	let div;
 	let div_style_value;
 	let div_intro;
@@ -580,9 +584,9 @@ function create_if_block$f(ctx) {
 	};
 }
 
-function create_fragment$j(ctx) {
+function create_fragment$k(ctx) {
 	let if_block_anchor;
-	let if_block = /*visible*/ ctx[2] && create_if_block$f(ctx);
+	let if_block = /*visible*/ ctx[2] && create_if_block$g(ctx);
 
 	return {
 		c() {
@@ -602,7 +606,7 @@ function create_fragment$j(ctx) {
 						internal.transition_in(if_block, 1);
 					}
 				} else {
-					if_block = create_if_block$f(ctx);
+					if_block = create_if_block$g(ctx);
 					if_block.c();
 					internal.transition_in(if_block, 1);
 					if_block.m(if_block_anchor.parentNode, if_block_anchor);
@@ -634,7 +638,7 @@ function px2rem(value) {
 	return typeof value === 'number' ? value / 16 + 'rem' : value;
 }
 
-function instance$j($$self, $$props, $$invalidate) {
+function instance$k($$self, $$props, $$invalidate) {
 	let { inDelay = 1000 } = $$props;
 	let { outDelay = 1000 } = $$props;
 	let { visible = true } = $$props;
@@ -692,8 +696,8 @@ class Shadow extends internal.SvelteComponent {
 		internal.init(
 			this,
 			options,
-			instance$j,
-			create_fragment$j,
+			instance$k,
+			create_fragment$k,
 			internal.safe_not_equal,
 			{
 				inDelay: 0,
@@ -711,7 +715,7 @@ class Shadow extends internal.SvelteComponent {
 				opacity: 12,
 				zIndex: 13
 			},
-			add_css$j
+			add_css$k
 		);
 	}
 }
@@ -735,7 +739,7 @@ const RANDON_STRING = random();
 
 /* src/PanoTagPlugin/Components/Common/Text.svelte generated by Svelte v3.50.1 */
 
-function add_css$i(target) {
+function add_css$j(target) {
 	internal.append_styles(target, "svelte-1b2n9wi", ".text-char.svelte-1b2n9wi{display:inline-block;text-shadow:0.125rem 0rem 0.5rem rgba(0, 0, 0, 0.15)}");
 }
 
@@ -747,7 +751,7 @@ function get_each_context$5(ctx, list, i) {
 	return child_ctx;
 }
 
-// (80:0) {#each contentList as item, index}
+// (79:0) {#each contentList as item, index}
 function create_each_block$5(ctx) {
 	let span;
 	let t_value = /*item*/ ctx[10] + "";
@@ -784,7 +788,7 @@ function create_each_block$5(ctx) {
 	};
 }
 
-function create_fragment$i(ctx) {
+function create_fragment$j(ctx) {
 	let each_1_anchor;
 	let each_value = /*contentList*/ ctx[1];
 	let each_blocks = [];
@@ -841,7 +845,7 @@ function create_fragment$i(ctx) {
 	};
 }
 
-function instance$i($$self, $$props, $$invalidate) {
+function instance$j($$self, $$props, $$invalidate) {
 	let contentList;
 	let { inDelay = 0 } = $$props;
 	let { outDelay = 0 } = $$props;
@@ -929,7 +933,6 @@ function instance$i($$self, $$props, $$invalidate) {
 					if (item.startsWith(emojiFlag)) return result.push(item.slice(emojiFlag.length)); else return result.push(...item.split(''));
 				});
 
-				// console.log(result.filter(Boolean))
 				return result.filter(Boolean);
 			})());
 		}
@@ -951,8 +954,8 @@ class Text extends internal.SvelteComponent {
 		internal.init(
 			this,
 			options,
-			instance$i,
-			create_fragment$i,
+			instance$j,
+			create_fragment$j,
 			internal.safe_not_equal,
 			{
 				inDelay: 2,
@@ -960,7 +963,7 @@ class Text extends internal.SvelteComponent {
 				content: 4,
 				unfolded: 5
 			},
-			add_css$i
+			add_css$j
 		);
 	}
 }
@@ -970,12 +973,12 @@ const Image_Play = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFQAAABUCAYAAA
 
 /* src/PanoTagPlugin/Components/Common/Arrow.svelte generated by Svelte v3.50.1 */
 
-function add_css$h(target) {
+function add_css$i(target) {
 	internal.append_styles(target, "svelte-1ogmlqq", ".arrow.svelte-1ogmlqq{width:100%;height:100%;background-size:100%;transition:transform 400ms ease-in-out;cursor:pointer;pointer-events:auto}.arrow-wrapper.svelte-1ogmlqq{position:relative;width:100%;height:100%}.arrow.left.svelte-1ogmlqq{transform:rotate(0deg)}.arrow.right.svelte-1ogmlqq{transform:rotate(-180deg)}.arrow.top.svelte-1ogmlqq{transform:rotate(90deg)}.arrow.bottom.svelte-1ogmlqq{transform:rotate(-90deg)}");
 }
 
 // (12:0) {#if visible}
-function create_if_block$e(ctx) {
+function create_if_block$f(ctx) {
 	let div1;
 	let shadow;
 	let t;
@@ -1068,10 +1071,10 @@ function create_if_block$e(ctx) {
 	};
 }
 
-function create_fragment$h(ctx) {
+function create_fragment$i(ctx) {
 	let if_block_anchor;
 	let current;
-	let if_block = /*visible*/ ctx[1] && create_if_block$e(ctx);
+	let if_block = /*visible*/ ctx[1] && create_if_block$f(ctx);
 
 	return {
 		c() {
@@ -1092,7 +1095,7 @@ function create_fragment$h(ctx) {
 						internal.transition_in(if_block, 1);
 					}
 				} else {
-					if_block = create_if_block$e(ctx);
+					if_block = create_if_block$f(ctx);
 					if_block.c();
 					internal.transition_in(if_block, 1);
 					if_block.m(if_block_anchor.parentNode, if_block_anchor);
@@ -1123,7 +1126,7 @@ function create_fragment$h(ctx) {
 	};
 }
 
-function instance$h($$self, $$props, $$invalidate) {
+function instance$i($$self, $$props, $$invalidate) {
 	let { direction = 'right' } = $$props;
 	let { visible = true } = $$props;
 	let { duration = 0 } = $$props;
@@ -1152,8 +1155,8 @@ class Arrow extends internal.SvelteComponent {
 		internal.init(
 			this,
 			options,
-			instance$h,
-			create_fragment$h,
+			instance$i,
+			create_fragment$i,
 			internal.safe_not_equal,
 			{
 				direction: 0,
@@ -1162,14 +1165,14 @@ class Arrow extends internal.SvelteComponent {
 				inDelay: 3,
 				outDelay: 4
 			},
-			add_css$h
+			add_css$i
 		);
 	}
 }
 
 /* src/PanoTagPlugin/Components/Common/MultiLineText.svelte generated by Svelte v3.50.1 */
 
-function add_css$g(target) {
+function add_css$h(target) {
 	internal.append_styles(target, "svelte-1fuzm7v", ".text.svelte-1fuzm7v{pointer-events:auto;box-sizing:border-box;display:inline-block;max-width:7.5rem;transition:transform 400ms ease-in-out;font-size:0.75rem;line-height:1.125rem;white-space:initial;cursor:pointer}.arrow.svelte-1fuzm7v{pointer-events:auto;display:inline-block;vertical-align:top;width:0.875rem;height:0.875rem;margin-left:0.125rem;margin-top:0.125rem}");
 }
 
@@ -1241,7 +1244,7 @@ function create_each_block$4(key_1, ctx) {
 }
 
 // (28:0) {#if lineHeight < textHeight}
-function create_if_block$d(ctx) {
+function create_if_block$e(ctx) {
 	let div;
 	let arrow;
 	let current;
@@ -1288,7 +1291,7 @@ function create_if_block$d(ctx) {
 	};
 }
 
-function create_fragment$g(ctx) {
+function create_fragment$h(ctx) {
 	let each_blocks = [];
 	let each_1_lookup = new Map();
 	let t;
@@ -1303,7 +1306,7 @@ function create_fragment$g(ctx) {
 		each_1_lookup.set(key, each_blocks[i] = create_each_block$4(key, child_ctx));
 	}
 
-	let if_block = /*lineHeight*/ ctx[3] < /*textHeight*/ ctx[4] && create_if_block$d(ctx);
+	let if_block = /*lineHeight*/ ctx[3] < /*textHeight*/ ctx[4] && create_if_block$e(ctx);
 
 	return {
 		c() {
@@ -1341,7 +1344,7 @@ function create_fragment$g(ctx) {
 						internal.transition_in(if_block, 1);
 					}
 				} else {
-					if_block = create_if_block$d(ctx);
+					if_block = create_if_block$e(ctx);
 					if_block.c();
 					internal.transition_in(if_block, 1);
 					if_block.m(if_block_anchor.parentNode, if_block_anchor);
@@ -1386,7 +1389,7 @@ function create_fragment$g(ctx) {
 	};
 }
 
-function instance$g($$self, $$props, $$invalidate) {
+function instance$h($$self, $$props, $$invalidate) {
 	let transform;
 	let arrowDirection;
 	let foldTextDelay;
@@ -1461,27 +1464,27 @@ class MultiLineText extends internal.SvelteComponent {
 		internal.init(
 			this,
 			options,
-			instance$g,
-			create_fragment$g,
+			instance$h,
+			create_fragment$h,
 			internal.safe_not_equal,
 			{
 				visible: 0,
 				textUnfolded: 8,
 				textItems: 1
 			},
-			add_css$g
+			add_css$h
 		);
 	}
 }
 
 /* src/PanoTagPlugin/Components/Tag/TextTag.svelte generated by Svelte v3.50.1 */
 
-function add_css$f(target) {
+function add_css$g(target) {
 	internal.append_styles(target, "svelte-4fxqxl", ".line.svelte-4fxqxl{position:absolute;top:0;left:0;width:10.125rem;height:0.0625rem;transform:translate3d(0, -50%, 0.625rem)}.content.svelte-4fxqxl{width:-webkit-max-content;width:-moz-max-content;width:max-content;height:3.375rem;padding:2.25rem 0.25rem 0 1rem;position:absolute;left:0;bottom:0;overflow:hidden;box-sizing:border-box;font-size:0;pointer-events:none;white-space:nowrap;font-weight:600}");
 }
 
 // (29:0) {#if tag.state}
-function create_if_block$c(ctx) {
+function create_if_block$d(ctx) {
 	let shadow;
 	let t0;
 	let div0;
@@ -1599,10 +1602,10 @@ function create_if_block$c(ctx) {
 	};
 }
 
-function create_fragment$f(ctx) {
+function create_fragment$g(ctx) {
 	let if_block_anchor;
 	let current;
-	let if_block = /*tag*/ ctx[0].state && create_if_block$c(ctx);
+	let if_block = /*tag*/ ctx[0].state && create_if_block$d(ctx);
 
 	return {
 		c() {
@@ -1623,7 +1626,7 @@ function create_fragment$f(ctx) {
 						internal.transition_in(if_block, 1);
 					}
 				} else {
-					if_block = create_if_block$c(ctx);
+					if_block = create_if_block$d(ctx);
 					if_block.c();
 					internal.transition_in(if_block, 1);
 					if_block.m(if_block_anchor.parentNode, if_block_anchor);
@@ -1654,7 +1657,7 @@ function create_fragment$f(ctx) {
 	};
 }
 
-function instance$f($$self, $$props, $$invalidate) {
+function instance$g($$self, $$props, $$invalidate) {
 	let unfolded;
 	let text;
 	let foldTextDelay;
@@ -1729,18 +1732,18 @@ function instance$f($$self, $$props, $$invalidate) {
 class TextTag extends internal.SvelteComponent {
 	constructor(options) {
 		super();
-		internal.init(this, options, instance$f, create_fragment$f, internal.safe_not_equal, { tag: 0 }, add_css$f);
+		internal.init(this, options, instance$g, create_fragment$g, internal.safe_not_equal, { tag: 0 }, add_css$g);
 	}
 }
 
 /* src/PanoTagPlugin/Components/Common/Line/Polyline.svelte generated by Svelte v3.50.1 */
 
-function add_css$e(target) {
+function add_css$f(target) {
 	internal.append_styles(target, "svelte-e72ouh", ".line.svelte-e72ouh{width:100%;height:100%;overflow:visible}");
 }
 
 // (18:2) {#if unfolded}
-function create_if_block$b(ctx) {
+function create_if_block$c(ctx) {
 	let path;
 	let path_intro;
 	let path_outro;
@@ -1800,13 +1803,13 @@ function create_if_block$b(ctx) {
 	};
 }
 
-function create_fragment$e(ctx) {
+function create_fragment$f(ctx) {
 	let svg;
 	let defs;
 	let linearGradient;
 	let stop0;
 	let stop1;
-	let if_block = /*unfolded*/ ctx[3] && create_if_block$b(ctx);
+	let if_block = /*unfolded*/ ctx[3] && create_if_block$c(ctx);
 
 	return {
 		c() {
@@ -1844,7 +1847,7 @@ function create_fragment$e(ctx) {
 						internal.transition_in(if_block, 1);
 					}
 				} else {
-					if_block = create_if_block$b(ctx);
+					if_block = create_if_block$c(ctx);
 					if_block.c();
 					internal.transition_in(if_block, 1);
 					if_block.m(svg, null);
@@ -1872,7 +1875,7 @@ function create_fragment$e(ctx) {
 	};
 }
 
-function instance$e($$self, $$props, $$invalidate) {
+function instance$f($$self, $$props, $$invalidate) {
 	let { inDelay = 0 } = $$props;
 	let { duration = 0 } = $$props;
 	let { outDelay = 0 } = $$props;
@@ -1896,8 +1899,8 @@ class Polyline extends internal.SvelteComponent {
 		internal.init(
 			this,
 			options,
-			instance$e,
-			create_fragment$e,
+			instance$f,
+			create_fragment$f,
 			internal.safe_not_equal,
 			{
 				inDelay: 0,
@@ -1905,98 +1908,295 @@ class Polyline extends internal.SvelteComponent {
 				outDelay: 2,
 				unfolded: 3
 			},
-			add_css$e
+			add_css$f
 		);
 	}
 }
 
+/* src/PanoTagPlugin/Components/Common/MediaItem.svelte generated by Svelte v3.50.1 */
+
+function add_css$e(target) {
+	internal.append_styles(target, "svelte-6jwk1w", ".media-item.svelte-6jwk1w{height:100%}.media-content.svelte-6jwk1w{width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none;-o-object-fit:inherit;object-fit:inherit}.video-icon.svelte-6jwk1w{width:1.75rem;height:1.75rem;background-size:100%;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}");
+}
+
+// (6:0) {#if media}
+function create_if_block$b(ctx) {
+	let div;
+	let div_style_value;
+
+	function select_block_type(ctx, dirty) {
+		if (/*media*/ ctx[0].type === 'Image') return create_if_block_1$7;
+		if (/*media*/ ctx[0].type === 'Video') return create_if_block_2$3;
+	}
+
+	let current_block_type = select_block_type(ctx);
+	let if_block = current_block_type && current_block_type(ctx);
+
+	return {
+		c() {
+			div = internal.element("div");
+			if (if_block) if_block.c();
+			internal.attr(div, "class", "media-item svelte-6jwk1w");
+			internal.attr(div, "style", div_style_value = `object-fit: ${/*objectFit*/ ctx[1]};`);
+		},
+		m(target, anchor) {
+			internal.insert(target, div, anchor);
+			if (if_block) if_block.m(div, null);
+		},
+		p(ctx, dirty) {
+			if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block) {
+				if_block.p(ctx, dirty);
+			} else {
+				if (if_block) if_block.d(1);
+				if_block = current_block_type && current_block_type(ctx);
+
+				if (if_block) {
+					if_block.c();
+					if_block.m(div, null);
+				}
+			}
+
+			if (dirty & /*objectFit*/ 2 && div_style_value !== (div_style_value = `object-fit: ${/*objectFit*/ ctx[1]};`)) {
+				internal.attr(div, "style", div_style_value);
+			}
+		},
+		d(detaching) {
+			if (detaching) internal.detach(div);
+
+			if (if_block) {
+				if_block.d();
+			}
+		}
+	};
+}
+
+// (10:37) 
+function create_if_block_2$3(ctx) {
+	let video;
+	let video_src_value;
+	let video_poster_value;
+	let video_preload_value;
+	let t;
+	let div;
+
+	return {
+		c() {
+			video = internal.element("video");
+			t = internal.space();
+			div = internal.element("div");
+			internal.attr(video, "class", "media-content svelte-6jwk1w");
+			if (!internal.src_url_equal(video.src, video_src_value = /*media*/ ctx[0].url)) internal.attr(video, "src", video_src_value);
+			internal.attr(video, "poster", video_poster_value = /*media*/ ctx[0].videoCoverUrl ?? undefined);
+			internal.attr(video, "preload", video_preload_value = /*media*/ ctx[0].videoCoverUrl ? undefined : 'auto');
+			video.playsInline = true;
+			internal.attr(video, "paused", "");
+			video.loop = false;
+			internal.attr(video, "crossorigin", "");
+			video.controls = false;
+			video.muted = true;
+			internal.attr(div, "class", "video-icon svelte-6jwk1w");
+			internal.set_style(div, "background-image", "url(" + Image_Play + ")");
+		},
+		m(target, anchor) {
+			internal.insert(target, video, anchor);
+			internal.insert(target, t, anchor);
+			internal.insert(target, div, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*media*/ 1 && !internal.src_url_equal(video.src, video_src_value = /*media*/ ctx[0].url)) {
+				internal.attr(video, "src", video_src_value);
+			}
+
+			if (dirty & /*media*/ 1 && video_poster_value !== (video_poster_value = /*media*/ ctx[0].videoCoverUrl ?? undefined)) {
+				internal.attr(video, "poster", video_poster_value);
+			}
+
+			if (dirty & /*media*/ 1 && video_preload_value !== (video_preload_value = /*media*/ ctx[0].videoCoverUrl ? undefined : 'auto')) {
+				internal.attr(video, "preload", video_preload_value);
+			}
+		},
+		d(detaching) {
+			if (detaching) internal.detach(video);
+			if (detaching) internal.detach(t);
+			if (detaching) internal.detach(div);
+		}
+	};
+}
+
+// (8:4) {#if media.type === 'Image'}
+function create_if_block_1$7(ctx) {
+	let img;
+	let img_src_value;
+	let img_alt_value;
+
+	return {
+		c() {
+			img = internal.element("img");
+			internal.attr(img, "class", "media-content svelte-6jwk1w");
+			if (!internal.src_url_equal(img.src, img_src_value = /*media*/ ctx[0].url)) internal.attr(img, "src", img_src_value);
+			internal.attr(img, "alt", img_alt_value = /*media*/ ctx[0].name);
+		},
+		m(target, anchor) {
+			internal.insert(target, img, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*media*/ 1 && !internal.src_url_equal(img.src, img_src_value = /*media*/ ctx[0].url)) {
+				internal.attr(img, "src", img_src_value);
+			}
+
+			if (dirty & /*media*/ 1 && img_alt_value !== (img_alt_value = /*media*/ ctx[0].name)) {
+				internal.attr(img, "alt", img_alt_value);
+			}
+		},
+		d(detaching) {
+			if (detaching) internal.detach(img);
+		}
+	};
+}
+
+function create_fragment$e(ctx) {
+	let if_block_anchor;
+	let if_block = /*media*/ ctx[0] && create_if_block$b(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = internal.empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			internal.insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*media*/ ctx[0]) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block$b(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		i: internal.noop,
+		o: internal.noop,
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) internal.detach(if_block_anchor);
+		}
+	};
+}
+
+function instance$e($$self, $$props, $$invalidate) {
+	let { media } = $$props;
+	let { objectFit = 'cover' } = $$props;
+
+	$$self.$$set = $$props => {
+		if ('media' in $$props) $$invalidate(0, media = $$props.media);
+		if ('objectFit' in $$props) $$invalidate(1, objectFit = $$props.objectFit);
+	};
+
+	return [media, objectFit];
+}
+
+class MediaItem extends internal.SvelteComponent {
+	constructor(options) {
+		super();
+		internal.init(this, options, instance$e, create_fragment$e, internal.safe_not_equal, { media: 0, objectFit: 1 }, add_css$e);
+	}
+}
+
 /* src/PanoTagPlugin/Components/Common/Media.svelte generated by Svelte v3.50.1 */
 
 function add_css$d(target) {
-	internal.append_styles(target, "svelte-129jnm", ".media.svelte-129jnm{width:100%;height:100%;position:relative;overflow:hidden;border-radius:0.125rem}.carousel-item.svelte-129jnm{height:100%}.media-content.svelte-129jnm{width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none;-o-object-fit:inherit;object-fit:inherit}.video-icon.svelte-129jnm{width:1.75rem;height:1.75rem;background-size:100%;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}");
+	internal.append_styles(target, "svelte-ai0lv9", ".media.svelte-ai0lv9{width:100%;height:100%;position:relative;overflow:hidden;border-radius:0.125rem}");
 }
 
 function get_each_context$3(ctx, list, i) {
 	const child_ctx = ctx.slice();
-	child_ctx[9] = list[i];
+	child_ctx[14] = list[i];
 	return child_ctx;
 }
 
-// (16:0) {#if unfolded}
+// (24:0) {#if unfolded}
 function create_if_block$a(ctx) {
 	let div;
+	let current_block_type_index;
+	let if_block;
 	let div_intro;
 	let div_outro;
 	let current;
-	let each_value = /*mediaDataList*/ ctx[6];
-	let each_blocks = [];
+	const if_block_creators = [create_if_block_1$6, create_else_block$1];
+	const if_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));
+	function select_block_type(ctx, dirty) {
+		if (/*carouselEnabled*/ ctx[11]) return 0;
+		return 1;
 	}
 
+	current_block_type_index = select_block_type(ctx);
+	if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
+
 	return {
 		c() {
 			div = internal.element("div");
-
-			for (let i = 0; i < each_blocks.length; i += 1) {
-				each_blocks[i].c();
-			}
-
-			internal.attr(div, "class", "media svelte-129jnm");
-			internal.toggle_class(div, "unfolded", /*unfolded*/ ctx[3]);
+			if_block.c();
+			internal.attr(div, "class", "media svelte-ai0lv9");
+			internal.toggle_class(div, "unfolded", /*unfolded*/ ctx[4]);
 		},
 		m(target, anchor) {
 			internal.insert(target, div, anchor);
-
-			for (let i = 0; i < each_blocks.length; i += 1) {
-				each_blocks[i].m(div, null);
-			}
-
+			if_blocks[current_block_type_index].m(div, null);
 			current = true;
 		},
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
+			let previous_block_index = current_block_type_index;
+			current_block_type_index = select_block_type(ctx);
 
-			if (dirty & /*objectFit, Image_Play, mediaDataList*/ 96) {
-				each_value = /*mediaDataList*/ ctx[6];
-				let i;
+			if (current_block_type_index === previous_block_index) {
+				if_blocks[current_block_type_index].p(ctx, dirty);
+			} else {
+				internal.group_outros();
 
-				for (i = 0; i < each_value.length; i += 1) {
-					const child_ctx = get_each_context$3(ctx, each_value, i);
+				internal.transition_out(if_blocks[previous_block_index], 1, 1, () => {
+					if_blocks[previous_block_index] = null;
+				});
 
-					if (each_blocks[i]) {
-						each_blocks[i].p(child_ctx, dirty);
-					} else {
-						each_blocks[i] = create_each_block$3(child_ctx);
-						each_blocks[i].c();
-						each_blocks[i].m(div, null);
-					}
-				}
+				internal.check_outros();
+				if_block = if_blocks[current_block_type_index];
 
-				for (; i < each_blocks.length; i += 1) {
-					each_blocks[i].d(1);
+				if (!if_block) {
+					if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
+					if_block.c();
+				} else {
+					if_block.p(ctx, dirty);
 				}
 
-				each_blocks.length = each_value.length;
+				internal.transition_in(if_block, 1);
+				if_block.m(div, null);
 			}
 
-			if (!current || dirty & /*unfolded*/ 8) {
-				internal.toggle_class(div, "unfolded", /*unfolded*/ ctx[3]);
+			if (!current || dirty & /*unfolded*/ 16) {
+				internal.toggle_class(div, "unfolded", /*unfolded*/ ctx[4]);
 			}
 		},
 		i(local) {
 			if (current) return;
+			internal.transition_in(if_block);
 
 			if (local) {
 				internal.add_render_callback(() => {
 					if (div_outro) div_outro.end(1);
 
-					div_intro = internal.create_in_transition(div, transition.fly, /*animation*/ ctx[4]
+					div_intro = internal.create_in_transition(div, transition.fly, /*animation*/ ctx[5]
 					? {
 							y: 4,
-							duration: /*duration*/ ctx[2],
-							delay: /*inDelay*/ ctx[0],
+							duration: /*duration*/ ctx[3],
+							delay: /*inDelay*/ ctx[1],
 							easing: easing.linear
 						}
 					: undefined);
@@ -2008,14 +2208,15 @@ function create_if_block$a(ctx) {
 			current = true;
 		},
 		o(local) {
+			internal.transition_out(if_block);
 			if (div_intro) div_intro.invalidate();
 
 			if (local) {
-				div_outro = internal.create_out_transition(div, transition.fly, /*animation*/ ctx[4]
+				div_outro = internal.create_out_transition(div, transition.fly, /*animation*/ ctx[5]
 				? {
 						y: 4,
-						duration: /*duration*/ ctx[2],
-						delay: /*outDelay*/ ctx[1],
+						duration: /*duration*/ ctx[3],
+						delay: /*outDelay*/ ctx[2],
 						easing: easing.linear
 					}
 				: undefined);
@@ -2025,211 +2226,295 @@ function create_if_block$a(ctx) {
 		},
 		d(detaching) {
 			if (detaching) internal.detach(div);
-			internal.destroy_each(each_blocks, detaching);
+			if_blocks[current_block_type_index].d();
 			if (detaching && div_outro) div_outro.end();
 		}
 	};
 }
 
-// (29:65) 
-function create_if_block_4$2(ctx) {
-	let video;
-	let video_src_value;
-	let video_poster_value;
+// (80:4) {:else}
+function create_else_block$1(ctx) {
+	let mediaitem;
+	let current;
+
+	mediaitem = new MediaItem({
+			props: {
+				media: /*mediaData*/ ctx[0][0],
+				objectFit: /*objectFit*/ ctx[6]
+			}
+		});
 
 	return {
 		c() {
-			video = internal.element("video");
-			internal.attr(video, "class", "media-content svelte-129jnm");
-			if (!internal.src_url_equal(video.src, video_src_value = /*media*/ ctx[9].url)) internal.attr(video, "src", video_src_value);
-			internal.attr(video, "poster", video_poster_value = /*media*/ ctx[9].videoCoverUrl);
-			video.playsInline = true;
-			internal.attr(video, "paused", "");
-			video.loop = false;
-			internal.attr(video, "preload", "auto");
-			internal.attr(video, "crossorigin", "");
-			video.controls = false;
-			video.muted = true;
+			internal.create_component(mediaitem.$$.fragment);
 		},
 		m(target, anchor) {
-			internal.insert(target, video, anchor);
+			internal.mount_component(mediaitem, target, anchor);
+			current = true;
+		},
+		p(ctx, dirty) {
+			const mediaitem_changes = {};
+			if (dirty & /*mediaData*/ 1) mediaitem_changes.media = /*mediaData*/ ctx[0][0];
+			if (dirty & /*objectFit*/ 64) mediaitem_changes.objectFit = /*objectFit*/ ctx[6];
+			mediaitem.$set(mediaitem_changes);
+		},
+		i(local) {
+			if (current) return;
+			internal.transition_in(mediaitem.$$.fragment, local);
+			current = true;
 		},
-		p(ctx, dirty) {
-			if (dirty & /*mediaDataList*/ 64 && !internal.src_url_equal(video.src, video_src_value = /*media*/ ctx[9].url)) {
-				internal.attr(video, "src", video_src_value);
-			}
-
-			if (dirty & /*mediaDataList*/ 64 && video_poster_value !== (video_poster_value = /*media*/ ctx[9].videoCoverUrl)) {
-				internal.attr(video, "poster", video_poster_value);
-			}
+		o(local) {
+			internal.transition_out(mediaitem.$$.fragment, local);
+			current = false;
 		},
 		d(detaching) {
-			if (detaching) internal.detach(video);
+			internal.destroy_component(mediaitem, detaching);
 		}
 	};
 }
 
-// (27:64) 
-function create_if_block_3$2(ctx) {
-	let img;
-	let img_src_value;
-	let img_alt_value;
+// (31:4) {#if carouselEnabled}
+function create_if_block_1$6(ctx) {
+	let swiper$1;
+	let current;
+
+	swiper$1 = new svelte$1.Swiper({
+			props: {
+				style: "height: 100%",
+				modules: [swiper.Autoplay],
+				spaceBetween: 30,
+				autoplay: /*autoplay*/ ctx[10]
+				? noTypecheck({
+						delay: 2000,
+						stopOnLastSlide: false,
+						disableOnInteraction: false
+					})
+				: false,
+				loop: true,
+				$$slots: { default: [create_default_slot] },
+				$$scope: { ctx }
+			}
+		});
+
+	swiper$1.$on("slideChange", /*slideChange_handler*/ ctx[13]);
 
 	return {
 		c() {
-			img = internal.element("img");
-			internal.attr(img, "class", "media-content svelte-129jnm");
-			if (!internal.src_url_equal(img.src, img_src_value = /*media*/ ctx[9].videoCoverUrl)) internal.attr(img, "src", img_src_value);
-			internal.attr(img, "alt", img_alt_value = /*media*/ ctx[9].name);
+			internal.create_component(swiper$1.$$.fragment);
 		},
 		m(target, anchor) {
-			internal.insert(target, img, anchor);
+			internal.mount_component(swiper$1, target, anchor);
+			current = true;
 		},
 		p(ctx, dirty) {
-			if (dirty & /*mediaDataList*/ 64 && !internal.src_url_equal(img.src, img_src_value = /*media*/ ctx[9].videoCoverUrl)) {
-				internal.attr(img, "src", img_src_value);
-			}
+			const swiper_changes = {};
 
-			if (dirty & /*mediaDataList*/ 64 && img_alt_value !== (img_alt_value = /*media*/ ctx[9].name)) {
-				internal.attr(img, "alt", img_alt_value);
+			if (dirty & /*autoplay*/ 1024) swiper_changes.autoplay = /*autoplay*/ ctx[10]
+			? noTypecheck({
+					delay: 2000,
+					stopOnLastSlide: false,
+					disableOnInteraction: false
+				})
+			: false;
+
+			if (dirty & /*$$scope, mediaDataList, objectFit*/ 131392) {
+				swiper_changes.$$scope = { dirty, ctx };
 			}
+
+			swiper$1.$set(swiper_changes);
+		},
+		i(local) {
+			if (current) return;
+			internal.transition_in(swiper$1.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			internal.transition_out(swiper$1.$$.fragment, local);
+			current = false;
 		},
 		d(detaching) {
-			if (detaching) internal.detach(img);
+			internal.destroy_component(swiper$1, detaching);
 		}
 	};
 }
 
-// (25:8) {#if media.type === 'Image'}
-function create_if_block_2$3(ctx) {
-	let img;
-	let img_src_value;
-	let img_alt_value;
+// (75:10) <SwiperSlide>
+function create_default_slot_1(ctx) {
+	let mediaitem;
+	let t;
+	let current;
+
+	mediaitem = new MediaItem({
+			props: {
+				media: /*media*/ ctx[14],
+				objectFit: /*objectFit*/ ctx[6]
+			}
+		});
 
 	return {
 		c() {
-			img = internal.element("img");
-			internal.attr(img, "class", "media-content carousel-indicator-item svelte-129jnm");
-			if (!internal.src_url_equal(img.src, img_src_value = /*media*/ ctx[9].url)) internal.attr(img, "src", img_src_value);
-			internal.attr(img, "alt", img_alt_value = /*media*/ ctx[9].name);
+			internal.create_component(mediaitem.$$.fragment);
+			t = internal.space();
 		},
 		m(target, anchor) {
-			internal.insert(target, img, anchor);
+			internal.mount_component(mediaitem, target, anchor);
+			internal.insert(target, t, anchor);
+			current = true;
 		},
 		p(ctx, dirty) {
-			if (dirty & /*mediaDataList*/ 64 && !internal.src_url_equal(img.src, img_src_value = /*media*/ ctx[9].url)) {
-				internal.attr(img, "src", img_src_value);
-			}
-
-			if (dirty & /*mediaDataList*/ 64 && img_alt_value !== (img_alt_value = /*media*/ ctx[9].name)) {
-				internal.attr(img, "alt", img_alt_value);
-			}
+			const mediaitem_changes = {};
+			if (dirty & /*mediaDataList*/ 256) mediaitem_changes.media = /*media*/ ctx[14];
+			if (dirty & /*objectFit*/ 64) mediaitem_changes.objectFit = /*objectFit*/ ctx[6];
+			mediaitem.$set(mediaitem_changes);
+		},
+		i(local) {
+			if (current) return;
+			internal.transition_in(mediaitem.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			internal.transition_out(mediaitem.$$.fragment, local);
+			current = false;
 		},
 		d(detaching) {
-			if (detaching) internal.detach(img);
+			internal.destroy_component(mediaitem, detaching);
+			if (detaching) internal.detach(t);
 		}
 	};
 }
 
-// (33:8) {#if media.type === 'Video'}
-function create_if_block_1$6(ctx) {
-	let div;
+// (74:8) {#each mediaDataList as media}
+function create_each_block$3(ctx) {
+	let swiperslide;
+	let current;
+
+	swiperslide = new svelte$1.SwiperSlide({
+			props: {
+				$$slots: { default: [create_default_slot_1] },
+				$$scope: { ctx }
+			}
+		});
 
 	return {
 		c() {
-			div = internal.element("div");
-			internal.attr(div, "class", "video-icon svelte-129jnm");
-			internal.set_style(div, "background-image", "url(" + Image_Play + ")");
+			internal.create_component(swiperslide.$$.fragment);
 		},
 		m(target, anchor) {
-			internal.insert(target, div, anchor);
+			internal.mount_component(swiperslide, target, anchor);
+			current = true;
+		},
+		p(ctx, dirty) {
+			const swiperslide_changes = {};
+
+			if (dirty & /*$$scope, mediaDataList, objectFit*/ 131392) {
+				swiperslide_changes.$$scope = { dirty, ctx };
+			}
+
+			swiperslide.$set(swiperslide_changes);
+		},
+		i(local) {
+			if (current) return;
+			internal.transition_in(swiperslide.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			internal.transition_out(swiperslide.$$.fragment, local);
+			current = false;
 		},
-		p: internal.noop,
 		d(detaching) {
-			if (detaching) internal.detach(div);
+			internal.destroy_component(swiperslide, detaching);
 		}
 	};
 }
 
-// (23:4) {#each mediaDataList as media}
-function create_each_block$3(ctx) {
-	let div;
-	let t0;
-	let t1;
-	let div_style_value;
+// (32:6) <Swiper         style="height: 100%"         modules={[Autoplay]}         spaceBetween={30}         autoplay={autoplay ? noTypecheck({ delay: 2000, stopOnLastSlide: false, disableOnInteraction: false }) : false}         loop         on:slideChange={async (event) => {           if (!autoplay) return           if (!autoplayConfig.autoplayVideo) return           const swiper = event.detail[0]           if (!swiper) return            const index = swiper.realIndex           // loop 完一圈后，swiper.realIndex 会重复一次，比如有三张图片 [0,1,2]，slideChange 触发后输出的 index 为 [0,1,2,0,0,1,2,0,0,1,2,0], 添加 lastAutoPlayIndex 判断后，输出为[0,1,2,0,1,2,0,1,2,0]           if (index === lastAutoPlayIndex) return           lastAutoPlayIndex = index            const media = mediaDataList[index]           if (!media) return           if (media.type !== 'Video') return            // 先暂停自动轮播           swiper.autoplay.stop()           // 播放视频           await new Promise((resolve) => {             const video = swiper.slides[swiper.activeIndex]?.querySelector('video')             if (!video) {               resolve(noTypecheck(null))               return             }             video.play()             video.onerror = () => resolve(noTypecheck(null))             video.onended = () => resolve(noTypecheck(null))             video.onclick = () => {               video.pause()               resolve(noTypecheck(null))             }           })           // 恢复自动轮播           swiper.autoplay.start()         }}       >
+function create_default_slot(ctx) {
+	let each_1_anchor;
+	let current;
+	let each_value = /*mediaDataList*/ ctx[8];
+	let each_blocks = [];
 
-	function select_block_type(ctx, dirty) {
-		if (/*media*/ ctx[9].type === 'Image') return create_if_block_2$3;
-		if (/*media*/ ctx[9].type === 'Video' && /*media*/ ctx[9].videoCoverUrl) return create_if_block_3$2;
-		if (/*media*/ ctx[9].type === 'Video' && !/*media*/ ctx[9].videoCoverUrl) return create_if_block_4$2;
+	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));
 	}
 
-	let current_block_type = select_block_type(ctx);
-	let if_block0 = current_block_type && current_block_type(ctx);
-	let if_block1 = /*media*/ ctx[9].type === 'Video' && create_if_block_1$6();
+	const out = i => internal.transition_out(each_blocks[i], 1, 1, () => {
+		each_blocks[i] = null;
+	});
 
 	return {
 		c() {
-			div = internal.element("div");
-			if (if_block0) if_block0.c();
-			t0 = internal.space();
-			if (if_block1) if_block1.c();
-			t1 = internal.space();
-			internal.attr(div, "class", "carousel-item svelte-129jnm");
-			internal.attr(div, "style", div_style_value = `object-fit: ${/*objectFit*/ ctx[5]};`);
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			each_1_anchor = internal.empty();
 		},
 		m(target, anchor) {
-			internal.insert(target, div, anchor);
-			if (if_block0) if_block0.m(div, null);
-			internal.append(div, t0);
-			if (if_block1) if_block1.m(div, null);
-			internal.append(div, t1);
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(target, anchor);
+			}
+
+			internal.insert(target, each_1_anchor, anchor);
+			current = true;
 		},
 		p(ctx, dirty) {
-			if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block0) {
-				if_block0.p(ctx, dirty);
-			} else {
-				if (if_block0) if_block0.d(1);
-				if_block0 = current_block_type && current_block_type(ctx);
+			if (dirty & /*mediaDataList, objectFit*/ 320) {
+				each_value = /*mediaDataList*/ ctx[8];
+				let i;
 
-				if (if_block0) {
-					if_block0.c();
-					if_block0.m(div, t0);
+				for (i = 0; i < each_value.length; i += 1) {
+					const child_ctx = get_each_context$3(ctx, each_value, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+						internal.transition_in(each_blocks[i], 1);
+					} else {
+						each_blocks[i] = create_each_block$3(child_ctx);
+						each_blocks[i].c();
+						internal.transition_in(each_blocks[i], 1);
+						each_blocks[i].m(each_1_anchor.parentNode, each_1_anchor);
+					}
 				}
-			}
 
-			if (/*media*/ ctx[9].type === 'Video') {
-				if (if_block1) {
-					if_block1.p(ctx, dirty);
-				} else {
-					if_block1 = create_if_block_1$6();
-					if_block1.c();
-					if_block1.m(div, t1);
+				internal.group_outros();
+
+				for (i = each_value.length; i < each_blocks.length; i += 1) {
+					out(i);
 				}
-			} else if (if_block1) {
-				if_block1.d(1);
-				if_block1 = null;
+
+				internal.check_outros();
 			}
+		},
+		i(local) {
+			if (current) return;
 
-			if (dirty & /*objectFit*/ 32 && div_style_value !== (div_style_value = `object-fit: ${/*objectFit*/ ctx[5]};`)) {
-				internal.attr(div, "style", div_style_value);
+			for (let i = 0; i < each_value.length; i += 1) {
+				internal.transition_in(each_blocks[i]);
 			}
+
+			current = true;
 		},
-		d(detaching) {
-			if (detaching) internal.detach(div);
+		o(local) {
+			each_blocks = each_blocks.filter(Boolean);
 
-			if (if_block0) {
-				if_block0.d();
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				internal.transition_out(each_blocks[i]);
 			}
 
-			if (if_block1) if_block1.d();
+			current = false;
+		},
+		d(detaching) {
+			internal.destroy_each(each_blocks, detaching);
+			if (detaching) internal.detach(each_1_anchor);
 		}
 	};
 }
 
 function create_fragment$d(ctx) {
 	let if_block_anchor;
-	let if_block = /*unfolded*/ ctx[3] && create_if_block$a(ctx);
+	let current;
+	let if_block = /*unfolded*/ ctx[4] && create_if_block$a(ctx);
 
 	return {
 		c() {
@@ -2239,13 +2524,14 @@ function create_fragment$d(ctx) {
 		m(target, anchor) {
 			if (if_block) if_block.m(target, anchor);
 			internal.insert(target, if_block_anchor, anchor);
+			current = true;
 		},
 		p(ctx, [dirty]) {
-			if (/*unfolded*/ ctx[3]) {
+			if (/*unfolded*/ ctx[4]) {
 				if (if_block) {
 					if_block.p(ctx, dirty);
 
-					if (dirty & /*unfolded*/ 8) {
+					if (dirty & /*unfolded*/ 16) {
 						internal.transition_in(if_block, 1);
 					}
 				} else {
@@ -2265,10 +2551,13 @@ function create_fragment$d(ctx) {
 			}
 		},
 		i(local) {
+			if (current) return;
 			internal.transition_in(if_block);
+			current = true;
 		},
 		o(local) {
 			internal.transition_out(if_block);
+			current = false;
 		},
 		d(detaching) {
 			if (if_block) if_block.d(detaching);
@@ -2278,7 +2567,9 @@ function create_fragment$d(ctx) {
 }
 
 function instance$d($$self, $$props, $$invalidate) {
+	let carouselEnabled;
 	let mediaDataList;
+	let autoplay;
 	let { mediaData } = $$props;
 	let { inDelay = 0 } = $$props;
 	let { outDelay = 0 } = $$props;
@@ -2287,34 +2578,93 @@ function instance$d($$self, $$props, $$invalidate) {
 	let { animation = true } = $$props;
 	let { objectFit = 'cover' } = $$props;
 	let { enableCarousel = true } = $$props;
+	let { autoplayConfig = { autoplay: true, autoplayVideo: false } } = $$props;
+	let lastAutoPlayIndex = null;
+
+	const slideChange_handler = async event => {
+		if (!autoplay) return;
+		if (!autoplayConfig.autoplayVideo) return;
+		const swiper = event.detail[0];
+		if (!swiper) return;
+		const index = swiper.realIndex;
+
+		// loop 完一圈后，swiper.realIndex 会重复一次，比如有三张图片 [0,1,2]，slideChange 触发后输出的 index 为 [0,1,2,0,0,1,2,0,0,1,2,0], 添加 lastAutoPlayIndex 判断后，输出为[0,1,2,0,1,2,0,1,2,0]
+		if (index === lastAutoPlayIndex) return;
+
+		$$invalidate(9, lastAutoPlayIndex = index);
+		const media = mediaDataList[index];
+		if (!media) return;
+		if (media.type !== 'Video') return;
+
+		// 先暂停自动轮播
+		swiper.autoplay.stop();
+
+		// 播放视频
+		await new Promise(resolve => {
+				const video = swiper.slides[swiper.activeIndex]?.querySelector('video');
+
+				if (!video) {
+					resolve(noTypecheck(null));
+					return;
+				}
+
+				video.play();
+				video.onerror = () => resolve(noTypecheck(null));
+				video.onended = () => resolve(noTypecheck(null));
+
+				video.onclick = () => {
+					video.pause();
+					resolve(noTypecheck(null));
+				};
+			});
+
+		// 恢复自动轮播
+		swiper.autoplay.start();
+	};
 
 	$$self.$$set = $$props => {
-		if ('mediaData' in $$props) $$invalidate(7, mediaData = $$props.mediaData);
-		if ('inDelay' in $$props) $$invalidate(0, inDelay = $$props.inDelay);
-		if ('outDelay' in $$props) $$invalidate(1, outDelay = $$props.outDelay);
-		if ('duration' in $$props) $$invalidate(2, duration = $$props.duration);
-		if ('unfolded' in $$props) $$invalidate(3, unfolded = $$props.unfolded);
-		if ('animation' in $$props) $$invalidate(4, animation = $$props.animation);
-		if ('objectFit' in $$props) $$invalidate(5, objectFit = $$props.objectFit);
-		if ('enableCarousel' in $$props) $$invalidate(8, enableCarousel = $$props.enableCarousel);
+		if ('mediaData' in $$props) $$invalidate(0, mediaData = $$props.mediaData);
+		if ('inDelay' in $$props) $$invalidate(1, inDelay = $$props.inDelay);
+		if ('outDelay' in $$props) $$invalidate(2, outDelay = $$props.outDelay);
+		if ('duration' in $$props) $$invalidate(3, duration = $$props.duration);
+		if ('unfolded' in $$props) $$invalidate(4, unfolded = $$props.unfolded);
+		if ('animation' in $$props) $$invalidate(5, animation = $$props.animation);
+		if ('objectFit' in $$props) $$invalidate(6, objectFit = $$props.objectFit);
+		if ('enableCarousel' in $$props) $$invalidate(12, enableCarousel = $$props.enableCarousel);
+		if ('autoplayConfig' in $$props) $$invalidate(7, autoplayConfig = $$props.autoplayConfig);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*enableCarousel, mediaData*/ 384) {
-			$$invalidate(6, mediaDataList = (enableCarousel ? mediaData : [mediaData[0]]).filter(notNil));
+		if ($$self.$$.dirty & /*enableCarousel, mediaData*/ 4097) {
+			$$invalidate(11, carouselEnabled = enableCarousel && (mediaData === null || mediaData === void 0
+			? void 0
+			: mediaData.length) > 1);
+		}
+
+		if ($$self.$$.dirty & /*mediaData*/ 1) {
+			$$invalidate(8, mediaDataList = mediaData);
+		}
+
+		if ($$self.$$.dirty & /*mediaDataList, autoplayConfig*/ 384) {
+			$$invalidate(10, autoplay = mediaDataList.length > 1 && autoplayConfig.autoplay);
 		}
 	};
 
 	return [
+		mediaData,
 		inDelay,
 		outDelay,
 		duration,
 		unfolded,
 		animation,
 		objectFit,
+		autoplayConfig,
 		mediaDataList,
-		mediaData,
-		enableCarousel
+		lastAutoPlayIndex,
+		autoplay,
+		carouselEnabled,
+		enableCarousel,
+		slideChange_handler
 	];
 }
 
@@ -2329,14 +2679,15 @@ class Media extends internal.SvelteComponent {
 			create_fragment$d,
 			internal.safe_not_equal,
 			{
-				mediaData: 7,
-				inDelay: 0,
-				outDelay: 1,
-				duration: 2,
-				unfolded: 3,
-				animation: 4,
-				objectFit: 5,
-				enableCarousel: 8
+				mediaData: 0,
+				inDelay: 1,
+				outDelay: 2,
+				duration: 3,
+				unfolded: 4,
+				animation: 5,
+				objectFit: 6,
+				enableCarousel: 12,
+				autoplayConfig: 7
 			},
 			add_css$d
 		);
@@ -2570,6 +2921,7 @@ function create_if_block_1$5(ctx) {
 
 	media = new Media({
 			props: {
+				autoplayConfig: { autoplay: false },
 				unfolded: /*unfolded*/ ctx[4],
 				mediaData: /*mediaData*/ ctx[3],
 				inDelay: 500,
@@ -3917,7 +4269,7 @@ function add_css$8(target) {
 	internal.append_styles(target, "svelte-10cw0el", ".media-wrapper.svelte-10cw0el{position:absolute;width:100%;height:100%}");
 }
 
-// (18:0) {#if tag.state && mediaData}
+// (20:0) {#if tag.state && mediaData}
 function create_if_block$5(ctx) {
 	let div;
 	let media;
@@ -3925,10 +4277,11 @@ function create_if_block$5(ctx) {
 
 	media = new Media({
 			props: {
-				unfolded: /*unfolded*/ ctx[3],
-				mediaData: /*mediaData*/ ctx[2],
-				objectFit: /*objectFit*/ ctx[1],
-				enableCarousel: true,
+				unfolded: /*unfolded*/ ctx[5],
+				mediaData: /*mediaData*/ ctx[4],
+				objectFit: /*objectFit*/ ctx[2],
+				enableCarousel: /*enableCarousel*/ ctx[1],
+				autoplayConfig: /*autoplayConfig*/ ctx[3],
 				inDelay: 500,
 				duration: 500
 			}
@@ -3947,9 +4300,11 @@ function create_if_block$5(ctx) {
 		},
 		p(ctx, dirty) {
 			const media_changes = {};
-			if (dirty & /*unfolded*/ 8) media_changes.unfolded = /*unfolded*/ ctx[3];
-			if (dirty & /*mediaData*/ 4) media_changes.mediaData = /*mediaData*/ ctx[2];
-			if (dirty & /*objectFit*/ 2) media_changes.objectFit = /*objectFit*/ ctx[1];
+			if (dirty & /*unfolded*/ 32) media_changes.unfolded = /*unfolded*/ ctx[5];
+			if (dirty & /*mediaData*/ 16) media_changes.mediaData = /*mediaData*/ ctx[4];
+			if (dirty & /*objectFit*/ 4) media_changes.objectFit = /*objectFit*/ ctx[2];
+			if (dirty & /*enableCarousel*/ 2) media_changes.enableCarousel = /*enableCarousel*/ ctx[1];
+			if (dirty & /*autoplayConfig*/ 8) media_changes.autoplayConfig = /*autoplayConfig*/ ctx[3];
 			media.$set(media_changes);
 		},
 		i(local) {
@@ -3971,7 +4326,7 @@ function create_if_block$5(ctx) {
 function create_fragment$8(ctx) {
 	let if_block_anchor;
 	let current;
-	let if_block = /*tag*/ ctx[0].state && /*mediaData*/ ctx[2] && create_if_block$5(ctx);
+	let if_block = /*tag*/ ctx[0].state && /*mediaData*/ ctx[4] && create_if_block$5(ctx);
 
 	return {
 		c() {
@@ -3984,11 +4339,11 @@ function create_fragment$8(ctx) {
 			current = true;
 		},
 		p(ctx, [dirty]) {
-			if (/*tag*/ ctx[0].state && /*mediaData*/ ctx[2]) {
+			if (/*tag*/ ctx[0].state && /*mediaData*/ ctx[4]) {
 				if (if_block) {
 					if_block.p(ctx, dirty);
 
-					if (dirty & /*tag, mediaData*/ 5) {
+					if (dirty & /*tag, mediaData*/ 17) {
 						internal.transition_in(if_block, 1);
 					}
 				} else {
@@ -4026,8 +4381,10 @@ function create_fragment$8(ctx) {
 function instance$8($$self, $$props, $$invalidate) {
 	let unfolded;
 	let mediaData;
+	let enableCarousel;
+	let autoplayConfig;
 	let objectFit;
-	var _a;
+	var _a, _b;
 	let { tag } = $$props;
 
 	$$self.$$set = $$props => {
@@ -4036,23 +4393,38 @@ function instance$8($$self, $$props, $$invalidate) {
 
 	$$self.$$.update = () => {
 		if ($$self.$$.dirty & /*tag*/ 1) {
-			$$invalidate(3, unfolded = tag.state ? tag.state.unfolded : false);
+			$$invalidate(5, unfolded = tag.state ? tag.state.unfolded : false);
+		}
+
+		if ($$self.$$.dirty & /*tag*/ 1) {
+			$$invalidate(4, mediaData = tag.data.mediaData);
 		}
 
 		if ($$self.$$.dirty & /*tag*/ 1) {
-			$$invalidate(2, mediaData = tag.data.mediaData);
+			$$invalidate(1, enableCarousel = tag.data.enableCarousel);
 		}
 
-		if ($$self.$$.dirty & /*tag, _a*/ 17) {
-			$$invalidate(1, objectFit = $$invalidate(4, _a = tag.data.objectFit) !== null && _a !== void 0
+		if ($$self.$$.dirty & /*tag, _a, enableCarousel*/ 67) {
+			$$invalidate(3, autoplayConfig = $$invalidate(6, _a = tag.data.autoplayConfig) !== null && _a !== void 0
 			? _a
+			: {
+					autoplay: enableCarousel !== null && enableCarousel !== void 0
+					? enableCarousel
+					: true,
+					autoplayVideo: true
+				});
+		}
+
+		if ($$self.$$.dirty & /*tag, _b*/ 129) {
+			$$invalidate(2, objectFit = $$invalidate(7, _b = tag.data.objectFit) !== null && _b !== void 0
+			? _b
 			: (() => {
 					if (tag.data.adaptationMode === 'stretch') return 'cover'; else if (tag.data.adaptationMode === 'proportional') return 'contain'; else return undefined;
 				})());
 		}
 	};
 
-	return [tag, objectFit, mediaData, unfolded, _a];
+	return [tag, enableCarousel, objectFit, autoplayConfig, mediaData, unfolded, _a, _b];
 }
 
 class MediaPlane extends internal.SvelteComponent {
@@ -6223,6 +6595,16 @@ class TagComputer extends TagCacheController {
             value: new THREE__namespace.Raycaster()
         });
     }
+    getTagById(id) {
+        const tag = this.tags.find((tag) => {
+            return tag.id === id;
+        });
+        if (!tag) {
+            console.error(`getTagById(): tag is ${tag}, id is ${id}`);
+            return undefined;
+        }
+        return tag;
+    }
     /**
      * @description: 改变配置
      */
@@ -6277,7 +6659,6 @@ class TagComputer extends TagCacheController {
             const visible = (() => {
                 var _a, _b, _c, _d, _e;
                 const config = (_a = this.getTagConfig(tag).visibleConfig) !== null && _a !== void 0 ? _a : {};
-                // console.log(config)
                 const distance = this.getDistance(tag);
                 if (typeof config === 'function') {
                     return config(this.five, { tag, distance });
@@ -6553,18 +6934,11 @@ class TagComputer extends TagCacheController {
             const unfolded = this.getUnfoldedByPanoIndex(tag);
             if (!tag.state)
                 return;
-            if (unfolded === undefined)
-                return;
-            tag.state.unfolded = unfolded;
-        });
-    }
-    setVisibleAndUnfoldedByPanoIndex() {
-        this.setVisibleByPanoIndex();
-        this.setUnfoldedByPanoIndex();
-        this.tags.forEach((tag) => {
-            var _a, _b;
+            if (unfolded !== undefined) {
+                tag.state.unfolded = unfolded;
+            }
             // 如果标签展开但不可见，就要判断autoUnfoldWhenHide
-            if (((_a = tag.state) === null || _a === void 0 ? void 0 : _a.unfolded) && !((_b = tag.state) === null || _b === void 0 ? void 0 : _b.visible)) {
+            if (unfolded && !tag.state.visible) {
                 const config = this.getTagConfig(tag);
                 if (typeof config.unfoldedConfig === 'object' && config.unfoldedConfig.autoUnfoldWhenHide !== false) {
                     tag.state.unfolded = false;
@@ -6585,16 +6959,6 @@ class TagComputer extends TagCacheController {
             return;
         return { x, y, z };
     }
-    getTagById(id) {
-        const tag = this.tags.find((tag) => {
-            return tag.id === id;
-        });
-        if (!tag) {
-            console.error(`getTagById(): tag is ${tag}, id is ${id}`);
-            return undefined;
-        }
-        return tag;
-    }
     // TODO: 优化点：下面这些函数，调用比较频繁，可以按点位加缓存
     filterPointTag() {
         return this.tags.filter((tag) => tag.pointType === exports.PointType.PointTag);
@@ -7410,9 +7774,10 @@ class Controller extends CSS3DRender {
 const CSS3DRenderPlugin = (five) => new Controller(five);
 
 // declare const __APP_VERSION__: string
-const VERSION = '0.3.7';
+const VERSION = '1.0.0';
 const PLUGIN_NAME = `DnalogelPlugin-PanoTagPlugin@${VERSION}`;
-const TAG_INITIAL_UNFOLDED = true;
+// 初始是否展开
+const TAG_INITIAL_UNFOLDED = false;
 const pluginFlag = (name) => `${PLUGIN_NAME}--${name}`;
 class PanoTagPluginController extends TagComputer {
     constructor(five, params) {
@@ -7522,8 +7887,9 @@ class PanoTagPluginController extends TagComputer {
     /**
      * @description: 加载数据
      */
-    load(data) {
+    load(data, config) {
         var _a, _b;
+        this.clearTags();
         console.log(PLUGIN_NAME, 'load:', { data });
         if (this.params.mergePluginDefaultConfigToLoadDataConfig) {
             this.config = objectAssignDeep__default["default"]({}, this.config, {
@@ -7537,17 +7903,15 @@ class PanoTagPluginController extends TagComputer {
             if (data.contentTypeConfig)
                 this.config.contentTypeConfig = data.contentTypeConfig;
         }
-        this.clearCache();
-        this.disposeAllCSS3DContainer();
-        this.tags = [];
-        this.addTag(data.tagList);
+        this.addTag(data.tagList, config);
+        // debug
         if (this.debug)
             addDebugPoints(this.five, this.tags);
     }
     /**
      * @description: 添加标签
      */
-    addTag(tag) {
+    addTag(tag, config) {
         const tags = Array.isArray(tag) ? tag : [tag];
         const _tags = tags
             .map((tag) => {
@@ -7557,7 +7921,7 @@ class PanoTagPluginController extends TagComputer {
             .filter((tag) => tag.position);
         this.tags.push(..._tags);
         actionAfterFiveModelLoad(this.five, () => {
-            var _a, _b;
+            var _a, _b, _c;
             // 添加事件
             if (this.store.eventListenerDisposer) {
                 (_b = (_a = this.store).eventListenerDisposer) === null || _b === void 0 ? void 0 : _b.call(_a);
@@ -7573,10 +7937,18 @@ class PanoTagPluginController extends TagComputer {
                 }, 200);
             }
             this.checkPanelTag();
-            this.setVisibleAndUnfoldedByPanoIndex();
-            this.updateRenderAllTag();
+            // v0.3.8 新增 withAnimation，默认 false
+            // v1.0.0 withAnimation 默认值改为 true
+            this.setVisibleAndUnfolded({ withAnimation: (_c = config === null || config === void 0 ? void 0 : config.withAnimation) !== null && _c !== void 0 ? _c : true }).then(() => this.updateRenderAllTags());
+            this.updateRenderAllTags();
         });
     }
+    clearTags() {
+        this.tags = [];
+        this.clearCache();
+        this.disposeAllCSS3DContainer();
+        this.updateRenderAllTags();
+    }
     async show(params) {
         const { userAction = true, withAnimation = false } = params !== null && params !== void 0 ? params : {};
         if (this.store.disposed)
@@ -7667,7 +8039,7 @@ class PanoTagPluginController extends TagComputer {
         }
         // 3D 转 2D 的时候要销毁 3D container
         this.checkPanelTag();
-        this.updateRenderAllTag();
+        this.updateRenderAllTags();
     }
     /**
      * @description: 改变tag任意属性
@@ -7685,7 +8057,7 @@ class PanoTagPluginController extends TagComputer {
         if ((currentTag === null || currentTag === void 0 ? void 0 : currentTag.tag3DContentSvelte) && (tag === null || tag === void 0 ? void 0 : tag.normal)) {
             currentTag.tag3DContentSvelte.currentNormal = arrayPositionToVector3(tag.normal);
         }
-        this.updateRenderAllTag();
+        this.updateRenderAllTags();
         this.checkPanelTag();
     }
     /**
@@ -7699,12 +8071,31 @@ class PanoTagPluginController extends TagComputer {
                 return;
             this.tags.splice(index, 1);
         });
-        this.updateRenderAllTag();
+        this.updateRenderAllTags();
     }
     /** 暂停当前标签内进行的所有多媒体 */
     pauseCurrentMedia() {
         this.mediaStore.set({ currentMediaUrl: '' });
     }
+    /**
+     * @description: 设置 visible 和 unfolded
+     */
+    async setVisibleAndUnfolded({ withAnimation } = { withAnimation: false }) {
+        this.setVisibleByPanoIndex();
+        if (withAnimation) {
+            return new Promise((resolve, reject) => {
+                // setTimeout 初始隐藏，然后展开，而不是一步到位，要不就没动画了
+                setTimeout(() => {
+                    this.setUnfoldedByPanoIndex();
+                    resolve();
+                }, 10); // 10ms 是等待 TextTag onMount
+            });
+        }
+        else {
+            this.setUnfoldedByPanoIndex();
+            return Promise.resolve();
+        }
+    }
     handleShow() {
         this.state.visible = true;
         this.updateTagContainerVisible();
@@ -7715,7 +8106,7 @@ class PanoTagPluginController extends TagComputer {
     }
     handleEnable() {
         this.state.enabled = true;
-        this.updateRenderAllTag();
+        this.updateRenderAllTags();
     }
     handleDisable() {
         var _a;
@@ -7761,7 +8152,7 @@ class PanoTagPluginController extends TagComputer {
         // resize
         const show = () => {
             this.show();
-            this.updateRenderAllTag();
+            this.updateRenderAllTags();
         };
         const { observe: hideObserve, unobserve: hideUnobserve } = resizeObserver(throttle(() => {
             /**
@@ -7799,7 +8190,7 @@ class PanoTagPluginController extends TagComputer {
                 tag.temporaryState = Object.assign(Object.assign({}, tag.temporaryState), { visible: false });
             }
         });
-        this.updateRenderAllTag();
+        this.updateRenderAllTags();
     }
     /**
      * @description: 走点/切换模型后显示
@@ -7837,13 +8228,13 @@ class PanoTagPluginController extends TagComputer {
                         tag.state.unfolded = false;
                 });
             }
-            this.updateRenderAllTag();
+            this.updateRenderAllTags();
         }
     }
     /**
      * @description: 更新所有标签
      */
-    updateRenderAllTag() {
+    updateRenderAllTags() {
         this.updateRenderPointTag();
         this.updateRenderPlaneTag();
     }
@@ -7864,20 +8255,20 @@ class PanoTagPluginController extends TagComputer {
             // 设置展开/收起
             this.setUnfoldedByCamera();
             // 渲染
-            this.updateRenderAllTag();
+            this.updateRenderAllTags();
         }, 100);
     }
     handleFiveCameraUpdate() {
         // 渲染
         this.updateRenderPointTag();
     }
-    handleFivePanoArrived() {
-        this.setVisibleAndUnfoldedByPanoIndex();
+    async handleFivePanoArrived() {
+        await this.setVisibleAndUnfolded();
         this.tags.forEach((tag) => {
             tag.temporaryState = Object.assign(Object.assign({}, tag.temporaryState), { visible: true });
         });
         // 渲染
-        this.updateRenderAllTag();
+        this.updateRenderAllTags();
     }
     setUnfoldedByCamera() {
         let hasTagUnfolded = false; // 是否有标签由于camera的转动而展开