@plaidev/karte-action-sdk 1.1.188 → 1.1.190-28154239.dabefd64

package/dist/index.es.js

@@ -25,6 +25,237 @@ const ALL_ACTION_SHORTEN_ID = 'KARTE_ALL_ACTION_SHORTEN_ID';
  */
 const KARTE_MODAL_ROOT = 'karte-modal-root';
 
+/** @internal */
+const NOOP = (_args) => { }; // eslint-disable-line @typescript-eslint/no-unused-vars
+/** @internal */
+const isPreview = () => {
+    return false;
+};
+/** @internal */
+const setPreviousFocus = () => {
+    const previously_focused = typeof document !== 'undefined' && document.activeElement;
+    if (previously_focused) {
+        previously_focused?.focus();
+    }
+};
+/** @internal */
+const handleKeydown = (handlers) => (e) => {
+    if (handlers[e.key]) {
+        handlers[e.key](e);
+    }
+};
+const POSITION_STYLES = {
+    'top-center': 'top: 0; right: 50%; transform: translate(+50%, 0%);',
+    'top-left': 'top: 0; left: 0; transform: translate(0%, 0%);',
+    'top-right': 'top: 0; right: 0; transform: translate(0%, 0%);',
+    'center-left': 'top: 50%; left: 0; transform: translate(0%, -50%);',
+    center: 'top: 50%; left: 50%; transform: translate(-50%, -50%);',
+    'center-right': 'top: 50%; right: 0; transform: translate(0%, -50%);',
+    'bottom-left': 'bottom: 0; left: 0; transform: translate(0%, 0%);',
+    'bottom-center': 'bottom: 0; left: 50%; transform: translate(-50%, 0%);',
+    'bottom-right': 'bottom: 0; right: 0; transform: translate(0%, 0);',
+    none: 'top: 0; bottom: 0; right: 0; left: 0;',
+};
+const TRANSFORM = {
+    'top-center': [50, 0],
+    'top-left': [0, 0],
+    'top-right': [0, 0],
+    'center-left': [0, -50],
+    center: [-50, -50],
+    'center-right': [0, -50],
+    'bottom-left': [0, 0],
+    'bottom-center': [-50, 0],
+    'bottom-right': [0, 0],
+    none: [0, 0],
+};
+/** @internal */
+const getPositionStyle = (position) => {
+    const style = POSITION_STYLES[position];
+    if (style != null) {
+        return style;
+    }
+    else {
+        console.warn(`[action-sdk] invalid '${position}', so we use 'center' instead`);
+        return POSITION_STYLES['center'];
+    }
+};
+/** @internal */
+const getTransform = (position) => {
+    const transform = TRANSFORM[position];
+    if (transform != null) {
+        return transform;
+    }
+    else {
+        console.warn(`[action-sdk] invalid '${position}', so we use 'center' instead`);
+        return TRANSFORM['center'];
+    }
+};
+/** @internal */
+const getMarginStyle = (margin) => {
+    return `margin: ${margin?.top ?? 0} ${margin?.right ?? 0} ${margin?.bottom ?? 0} ${margin?.left ?? 0};`;
+};
+/** @internal */
+const parseStyle = (style) => {
+    return Object.fromEntries(style.split(';').map(attr => attr.split(':').map(str => str.trim())));
+};
+/** @internal */
+const stringifyStyleObj = (styleObj) => {
+    return Object.entries(styleObj)
+        .map(([key, value]) => `${key}:${value}`)
+        .join(';');
+};
+/**
+ * スクロール率が達したときに呼び出すコールバックを登録します
+ *
+ * @param rate - スクロール率。この値は viewport でのスクロールのパーセンテージ
+ * @param fn - スクロール率が達したときに呼び出されるコールバック関数
+ *
+ * @returns スクロール率によって呼び出されるコールバックを停止する関数を返します
+ *
+ * @public
+ */
+function onScroll(rate, fn) {
+    const rates = Array.isArray(rate) ? rate : [rate];
+    const body = window.document.body;
+    const html = window.document.documentElement;
+    const contexts = new Map();
+    rates.forEach(rate => {
+        contexts.set(rate, {
+            rate,
+            repeat: false,
+            zone: 'out',
+            previousRate: 0,
+            deltaRate: 0,
+            scrollRate: 0,
+            scrollTop: html.scrollTop || body.scrollTop,
+        });
+    });
+    const _fn = fn;
+    const direction = (ctx) => ctx.deltaRate > 0 ? 'down' : 'up';
+    const updateStates = (ctx, repeat) => {
+        ctx.repeat = repeat;
+        // prettier-ignore
+        ctx.zone =
+            // case: the scroll rate cannot detect the rate when scrolling to the top
+            ctx.scrollTop === 0 && ctx.scrollRate >= ctx.rate
+                ? 'out'
+                : ctx.scrollRate >= ctx.rate
+                    ? 'in'
+                    : 'out';
+        // console.log('updateStates', ctx.zone);
+    };
+    // prettier-ignore
+    const canCall = ({ zone, scrollRate, rate, scrollTop, repeat }) => zone === 'out'
+        ? scrollRate >= rate
+        : repeat
+            // case: the scroll rate cannot detect the rate when scrolling to the top
+            ? scrollRate < rate || (scrollTop === 0 && scrollRate >= rate)
+            : false;
+    /*
+    // NOTE: same logic the above (code size optimiazation)
+    const canCall = (ctx: OnScrollInternalContext): boolean => {
+      // console.log('repeat', ctx.repeat, 'rate', ctx.rate, 'scrollRate', ctx.scrollRate, '1 - rate', 1 - ctx.rate, '1 - scrollRate', 1 - ctx.scrollRate, 'scrollRate >= rate', ctx.scrollRate >= ctx.rate, '1 - scrollRate >= 1 - rate', 1 - ctx.scrollRate >= 1 - ctx.rate);
+      // console.log(ctx.rate, 'deltaRate', ctx.deltaRate, 'reviousRate', ctx.previousRate)
+      if (ctx.zone === 'out') {
+        return ctx.scrollRate >= ctx.rate;
+      } else {
+        // 'in'
+        if (ctx.repeat) {
+          return ctx.scrollRate < ctx.rate || (ctx.scrollTop === 0 && ctx.scrollRate >= ctx.rate);
+        } else {
+          return false;
+        }
+      }
+    };
+    //*/
+    const onScroll = () => {
+        const scrollTop = html.scrollTop || body.scrollTop;
+        const pageHeight = Math.max(...[body.clientHeight, body.scrollHeight, html.scrollHeight, html.clientHeight]);
+        const viewHeight = Math.min(...[html.clientHeight, body.clientHeight]);
+        const scrollRate = (scrollTop + viewHeight) / pageHeight;
+        // console.log('scrollRate ->', scrollRate, 'scrollTop ->', scrollTop);
+        contexts.forEach(ctx => {
+            ctx.scrollRate = scrollRate;
+            ctx.deltaRate = ctx.scrollRate - ctx.previousRate;
+            ctx.previousRate = ctx.scrollRate;
+            ctx.scrollTop = scrollTop;
+            if (canCall(ctx)) {
+                const repeat = !!_fn(Object.assign({ direction: direction(ctx) }, ctx));
+                updateStates(ctx, repeat);
+            }
+        });
+    };
+    // register scorll event
+    window.addEventListener('scroll', onScroll);
+    // return disposing (finalizing/releasing) function
+    return () => {
+        window.removeEventListener('scroll', onScroll);
+    };
+}
+/**
+ * 指定した時間の経過後に呼び出すコールバックを登録します
+ *
+ * @param time - コールバックを呼び出すまでの時間。単位はミリセカンド(ms)
+ * @param fn - 指定した時間が経過後に呼び出されるコールバック関数
+ *
+ * @returns コールバックを呼び出すためのタイマーを停止する関数を返します
+ *
+ * @public
+ */
+function onTime(time, fn) {
+    const timeoutHandler = setTimeout(fn, time);
+    return () => timeoutHandler && clearTimeout(timeoutHandler);
+}
+/** @internal */
+function hasSuffix(value, suffix) {
+    return new RegExp(`[0-9]${suffix}$`).test(value);
+}
+/** @internal */
+function randStr(digit = 8) {
+    return Math.random().toString(32).substring(digit);
+}
+/**
+ * Goolge Fonts用のURLを生成
+ *
+ * @param fonts - フォント名の配列
+ * @param texts - 使用するテキストの配列
+ *
+ * @remarks
+ * textsを指定した場合フォントサイズが削減される
+ *
+ * @internal
+ */
+function makeGoogleFontUrl(fonts, texts) {
+    const params = [];
+    params.push('display=swap');
+    if (texts) {
+        texts.forEach(text => params.push(`text=${text}`));
+    }
+    fonts.forEach(font => params.push(`family=${font.replace(/['"]/g, '').replace(/ /g, '+')}`));
+    return `https://fonts.googleapis.com/css2?${params.join('&')}`;
+}
+/**
+ * HTML要素を生成
+ *
+ * @internal
+ */
+const h = (type, props, ...children) => {
+    const el = document.createElement(type);
+    for (const key of Object.keys(props)) {
+        const v = props[key];
+        if (key === 'style') {
+            Object.assign(el.style, v);
+        }
+        else {
+            el.setAttribute(key, v);
+        }
+    }
+    for (const child of children) {
+        el.appendChild(child);
+    }
+    return el;
+};
+
 /**
  * ポップアップ(モーダル)のコンポーネントで利用するPropの定義
  */
@@ -261,17 +492,17 @@ const Alignments = ['flex-start', 'center', 'flex-end'];
 /** @internal */
 const FlexDirections = ['row', 'column'];
 /** @internal */
-const ObjectFits = ['fill', 'contain', 'cover'];
+const ObjectFits = ['contain', 'cover', 'fill'];
 /** @internal */
 const ClipPaths = ['none', 'circle(closest-side)'];
 /** @internal */
 const Repeats = ['repeat', 'space', 'round', 'no-repeat'];
 /** @internal */
-const BackgroundSizes = ['cover', 'contain', 'auto'];
+const BackgroundSizes = ['auto', 'cover', 'contain'];
 /** @internal */
 const Cursors = ['default', 'pointer'];
 /** @internal */
-const Overflows = ['visible', 'auto', 'hidden'];
+const Overflows = ['hidden', 'auto', 'visible'];
 /** @internal */
 const WritingModes = ['horizontal-tb', 'vertical-lr'];
 /** @internal */
@@ -739,237 +970,6 @@ function resetVariables() {
  */
 const formData = writable({});
 
-/** @internal */
-const NOOP = (_args) => { }; // eslint-disable-line @typescript-eslint/no-unused-vars
-/** @internal */
-const isPreview = () => {
-    return false;
-};
-/** @internal */
-const setPreviousFocus = () => {
-    const previously_focused = typeof document !== 'undefined' && document.activeElement;
-    if (previously_focused) {
-        previously_focused?.focus();
-    }
-};
-/** @internal */
-const handleKeydown = (handlers) => (e) => {
-    if (handlers[e.key]) {
-        handlers[e.key](e);
-    }
-};
-const POSITION_STYLES = {
-    'top-center': 'top: 0; right: 50%; transform: translate(+50%, 0%);',
-    'top-left': 'top: 0; left: 0; transform: translate(0%, 0%);',
-    'top-right': 'top: 0; right: 0; transform: translate(0%, 0%);',
-    'center-left': 'top: 50%; left: 0; transform: translate(0%, -50%);',
-    center: 'top: 50%; left: 50%; transform: translate(-50%, -50%);',
-    'center-right': 'top: 50%; right: 0; transform: translate(0%, -50%);',
-    'bottom-left': 'bottom: 0; left: 0; transform: translate(0%, 0%);',
-    'bottom-center': 'bottom: 0; left: 50%; transform: translate(-50%, 0%);',
-    'bottom-right': 'bottom: 0; right: 0; transform: translate(0%, 0);',
-    none: 'top: 0; bottom: 0; right: 0; left: 0;',
-};
-const TRANSFORM = {
-    'top-center': [50, 0],
-    'top-left': [0, 0],
-    'top-right': [0, 0],
-    'center-left': [0, -50],
-    center: [-50, -50],
-    'center-right': [0, -50],
-    'bottom-left': [0, 0],
-    'bottom-center': [-50, 0],
-    'bottom-right': [0, 0],
-    none: [0, 0],
-};
-/** @internal */
-const getPositionStyle = (position) => {
-    const style = POSITION_STYLES[position];
-    if (style != null) {
-        return style;
-    }
-    else {
-        console.warn(`[action-sdk] invalid '${position}', so we use 'center' instead`);
-        return POSITION_STYLES['center'];
-    }
-};
-/** @internal */
-const getTransform = (position) => {
-    const transform = TRANSFORM[position];
-    if (transform != null) {
-        return transform;
-    }
-    else {
-        console.warn(`[action-sdk] invalid '${position}', so we use 'center' instead`);
-        return TRANSFORM['center'];
-    }
-};
-/** @internal */
-const getMarginStyle = (margin) => {
-    return `margin: ${margin?.top ?? 0} ${margin?.right ?? 0} ${margin?.bottom ?? 0} ${margin?.left ?? 0};`;
-};
-/** @internal */
-const parseStyle = (style) => {
-    return Object.fromEntries(style.split(';').map(attr => attr.split(':').map(str => str.trim())));
-};
-/** @internal */
-const stringifyStyleObj = (styleObj) => {
-    return Object.entries(styleObj)
-        .map(([key, value]) => `${key}:${value}`)
-        .join(';');
-};
-/**
- * スクロール率が達したときに呼び出すコールバックを登録します
- *
- * @param rate - スクロール率。この値は viewport でのスクロールのパーセンテージ
- * @param fn - スクロール率が達したときに呼び出されるコールバック関数
- *
- * @returns スクロール率によって呼び出されるコールバックを停止する関数を返します
- *
- * @public
- */
-function onScroll(rate, fn) {
-    const rates = Array.isArray(rate) ? rate : [rate];
-    const body = window.document.body;
-    const html = window.document.documentElement;
-    const contexts = new Map();
-    rates.forEach(rate => {
-        contexts.set(rate, {
-            rate,
-            repeat: false,
-            zone: 'out',
-            previousRate: 0,
-            deltaRate: 0,
-            scrollRate: 0,
-            scrollTop: html.scrollTop || body.scrollTop,
-        });
-    });
-    const _fn = fn;
-    const direction = (ctx) => ctx.deltaRate > 0 ? 'down' : 'up';
-    const updateStates = (ctx, repeat) => {
-        ctx.repeat = repeat;
-        // prettier-ignore
-        ctx.zone =
-            // case: the scroll rate cannot detect the rate when scrolling to the top
-            ctx.scrollTop === 0 && ctx.scrollRate >= ctx.rate
-                ? 'out'
-                : ctx.scrollRate >= ctx.rate
-                    ? 'in'
-                    : 'out';
-        // console.log('updateStates', ctx.zone);
-    };
-    // prettier-ignore
-    const canCall = ({ zone, scrollRate, rate, scrollTop, repeat }) => zone === 'out'
-        ? scrollRate >= rate
-        : repeat
-            // case: the scroll rate cannot detect the rate when scrolling to the top
-            ? scrollRate < rate || (scrollTop === 0 && scrollRate >= rate)
-            : false;
-    /*
-    // NOTE: same logic the above (code size optimiazation)
-    const canCall = (ctx: OnScrollInternalContext): boolean => {
-      // console.log('repeat', ctx.repeat, 'rate', ctx.rate, 'scrollRate', ctx.scrollRate, '1 - rate', 1 - ctx.rate, '1 - scrollRate', 1 - ctx.scrollRate, 'scrollRate >= rate', ctx.scrollRate >= ctx.rate, '1 - scrollRate >= 1 - rate', 1 - ctx.scrollRate >= 1 - ctx.rate);
-      // console.log(ctx.rate, 'deltaRate', ctx.deltaRate, 'reviousRate', ctx.previousRate)
-      if (ctx.zone === 'out') {
-        return ctx.scrollRate >= ctx.rate;
-      } else {
-        // 'in'
-        if (ctx.repeat) {
-          return ctx.scrollRate < ctx.rate || (ctx.scrollTop === 0 && ctx.scrollRate >= ctx.rate);
-        } else {
-          return false;
-        }
-      }
-    };
-    //*/
-    const onScroll = () => {
-        const scrollTop = html.scrollTop || body.scrollTop;
-        const pageHeight = Math.max(...[body.clientHeight, body.scrollHeight, html.scrollHeight, html.clientHeight]);
-        const viewHeight = Math.min(...[html.clientHeight, body.clientHeight]);
-        const scrollRate = (scrollTop + viewHeight) / pageHeight;
-        // console.log('scrollRate ->', scrollRate, 'scrollTop ->', scrollTop);
-        contexts.forEach(ctx => {
-            ctx.scrollRate = scrollRate;
-            ctx.deltaRate = ctx.scrollRate - ctx.previousRate;
-            ctx.previousRate = ctx.scrollRate;
-            ctx.scrollTop = scrollTop;
-            if (canCall(ctx)) {
-                const repeat = !!_fn(Object.assign({ direction: direction(ctx) }, ctx));
-                updateStates(ctx, repeat);
-            }
-        });
-    };
-    // register scorll event
-    window.addEventListener('scroll', onScroll);
-    // return disposing (finalizing/releasing) function
-    return () => {
-        window.removeEventListener('scroll', onScroll);
-    };
-}
-/**
- * 指定した時間の経過後に呼び出すコールバックを登録します
- *
- * @param time - コールバックを呼び出すまでの時間。単位はミリセカンド(ms)
- * @param fn - 指定した時間が経過後に呼び出されるコールバック関数
- *
- * @returns コールバックを呼び出すためのタイマーを停止する関数を返します
- *
- * @public
- */
-function onTime(time, fn) {
-    const timeoutHandler = setTimeout(fn, time);
-    return () => timeoutHandler && clearTimeout(timeoutHandler);
-}
-/** @internal */
-function hasSuffix(value, suffix) {
-    return new RegExp(`[0-9]${suffix}$`).test(value);
-}
-/** @internal */
-function randStr(digit = 8) {
-    return Math.random().toString(32).substring(digit);
-}
-/**
- * Goolge Fonts用のURLを生成
- *
- * @param fonts - フォント名の配列
- * @param texts - 使用するテキストの配列
- *
- * @remarks
- * textsを指定した場合フォントサイズが削減される
- *
- * @internal
- */
-function makeGoogleFontUrl(fonts, texts) {
-    const params = [];
-    params.push('display=swap');
-    if (texts) {
-        texts.forEach(text => params.push(`text=${text}`));
-    }
-    fonts.forEach(font => params.push(`family=${font.replace(/['"]/g, '').replace(/ /g, '+')}`));
-    return `https://fonts.googleapis.com/css2?${params.join('&')}`;
-}
-/**
- * HTML要素を生成
- *
- * @internal
- */
-const h = (type, props, ...children) => {
-    const el = document.createElement(type);
-    for (const key of Object.keys(props)) {
-        const v = props[key];
-        if (key === 'style') {
-            Object.assign(el.style, v);
-        }
-        else {
-            el.setAttribute(key, v);
-        }
-    }
-    for (const child of children) {
-        el.appendChild(child);
-    }
-    return el;
-};
-
 /**
  * アクションのログの記録の管理
  */
@@ -1086,11 +1086,9 @@ function cloneToJson(data) {
 
 // prettier-ignore
 /** @internal */
-const actionId = typeof __FIX_ACTION_CHANGE_STATE_EVENT__ === 'string'
-        ? __FIX_ACTION_CHANGE_STATE_EVENT__
-        : typeof __FLYER_GEN_ACTION_ID_ON_BUILD__ === 'string'
-            ? __FLYER_GEN_ACTION_ID_ON_BUILD__
-            : randStr();
+const actionId = typeof __FLYER_GEN_ACTION_ID_ON_BUILD__ === 'string'
+        ? __FLYER_GEN_ACTION_ID_ON_BUILD__
+        : randStr();
 /** @internal */
 const ACTION_DESTROY_EVENT = `KARTE-ACTION-DESTROY-${actionId}`;
 /** @internal */
@@ -2584,7 +2582,7 @@ class State extends SvelteComponent {
 /* src/components/StateItem.svelte generated by Svelte v3.53.1 */
 
 function add_css$t(target) {
-	append_styles(target, "svelte-1amihue", ".state-item.svelte-1amihue{position:absolute;display:none}");
+	append_styles(target, "svelte-2qb6dm", ".state-item.svelte-2qb6dm{position:absolute;display:none}");
 }
 
 // (23:0) {#if $state === path}
@@ -2601,7 +2599,7 @@ function create_if_block$8(ctx) {
 			t = space();
 			if (default_slot) default_slot.c();
 			attr(div, "data-state-path", /*path*/ ctx[0]);
-			attr(div, "class", "state-item svelte-1amihue");
+			attr(div, "class", "state-item svelte-2qb6dm");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -3002,7 +3000,7 @@ function customAnimation(node, { transform, animationStyle, delay = 0, duration
 /* src/components/BackgroundOverlay.svelte generated by Svelte v3.53.1 */
 
 function add_css$s(target) {
-	append_styles(target, "svelte-g6ucc2", ".background.svelte-g6ucc2{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.3);z-index:2147483646}");
+	append_styles(target, "svelte-1d4fta", ".background.svelte-1d4fta{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.3);z-index:2147483646}");
 }
 
 // (9:0) {#if backgroundOverlay}
@@ -3014,7 +3012,7 @@ function create_if_block$7(ctx) {
 	return {
 		c() {
 			div = element("div");
-			attr(div, "class", "background svelte-g6ucc2");
+			attr(div, "class", "background svelte-1d4fta");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -3125,7 +3123,7 @@ function checkStopPropagation(eventName, handler) {
 /* src/components/Button.svelte generated by Svelte v3.53.1 */
 
 function add_css$r(target) {
-	append_styles(target, "svelte-1dtbrzj", ".button.svelte-1dtbrzj{display:block;text-decoration:none;color:inherit;border:none;background:none;margin:0;padding:0}.button.svelte-1dtbrzj:link,.button.svelte-1dtbrzj:visited,.button.svelte-1dtbrzj:active,.button.svelte-1dtbrzj:hover{color:inherit}");
+	append_styles(target, "svelte-1tg0tf", ".button.svelte-1tg0tf{display:block;text-decoration:none;color:inherit;border:none;background:none;margin:0;padding:0}.button.svelte-1tg0tf:link,.button.svelte-1tg0tf:visited,.button.svelte-1tg0tf:active,.button.svelte-1tg0tf:hover{color:inherit}");
 }
 
 // (50:0) {:else}
@@ -3154,7 +3152,7 @@ function create_else_block$3(ctx) {
 			button = element("button");
 			if (default_slot) default_slot.c();
 			set_attributes(button, button_data);
-			toggle_class(button, "svelte-1dtbrzj", true);
+			toggle_class(button, "svelte-1tg0tf", true);
 		},
 		m(target, anchor) {
 			insert(target, button, anchor);
@@ -3193,7 +3191,7 @@ function create_else_block$3(ctx) {
 				dataAttrStopPropagation('click')
 			]));
 
-			toggle_class(button, "svelte-1dtbrzj", true);
+			toggle_class(button, "svelte-1tg0tf", true);
 		},
 		i(local) {
 			if (current) return;
@@ -3224,7 +3222,7 @@ function create_if_block_2(ctx) {
 		c() {
 			div = element("div");
 			if (default_slot) default_slot.c();
-			attr(div, "class", "" + (null_to_empty(BUTTON_CLASS) + " svelte-1dtbrzj"));
+			attr(div, "class", "" + (null_to_empty(BUTTON_CLASS) + " svelte-1tg0tf"));
 			attr(div, "style", /*style*/ ctx[1]);
 		},
 		m(target, anchor) {
@@ -3306,7 +3304,7 @@ function create_if_block_1$2(ctx) {
 			a = element("a");
 			if (default_slot) default_slot.c();
 			set_attributes(a, a_data);
-			toggle_class(a, "svelte-1dtbrzj", true);
+			toggle_class(a, "svelte-1tg0tf", true);
 		},
 		m(target, anchor) {
 			insert(target, a, anchor);
@@ -3346,7 +3344,7 @@ function create_if_block_1$2(ctx) {
 				dataAttrStopPropagation('click')
 			]));
 
-			toggle_class(a, "svelte-1dtbrzj", true);
+			toggle_class(a, "svelte-1tg0tf", true);
 		},
 		i(local) {
 			if (current) return;
@@ -3377,7 +3375,7 @@ function create_if_block$6(ctx) {
 		c() {
 			div = element("div");
 			if (default_slot) default_slot.c();
-			attr(div, "class", "" + (BUTTON_CLASS + " _disabled" + " svelte-1dtbrzj"));
+			attr(div, "class", "" + (BUTTON_CLASS + " _disabled" + " svelte-1tg0tf"));
 			attr(div, "style", /*style*/ ctx[1]);
 		},
 		m(target, anchor) {
@@ -3581,7 +3579,7 @@ class Button extends SvelteComponent {
 /* src/components/Modal.svelte generated by Svelte v3.53.1 */
 
 function add_css$q(target) {
-	append_styles(target, "svelte-1vrjevr", ".modal.svelte-1vrjevr{position:fixed;box-sizing:border-box;z-index:2147483647;display:flex}.modal.svelte-1vrjevr > .button{flex:auto;display:flex}.close.svelte-1vrjevr{position:absolute;top:0;right:0}.close.svelte-1vrjevr > .button{position:absolute;display:flex;justify-content:center;align-items:center;background-color:transparent;border:none;cursor:pointer;padding:0;transition:all 0.25s}.close.svelte-1vrjevr > .button:hover{transform:rotate(90deg)}.modal-content.svelte-1vrjevr{flex:auto;display:flex;justify-content:center;align-items:center}");
+	append_styles(target, "svelte-1invh97", ".modal.svelte-1invh97{position:fixed;box-sizing:border-box;z-index:2147483647;display:flex}.modal.svelte-1invh97 > .button{flex:auto;display:flex}.close.svelte-1invh97{position:absolute;top:0;right:0}.close.svelte-1invh97 > .button{position:absolute;display:flex;justify-content:center;align-items:center;background-color:transparent;border:none;cursor:pointer;padding:0;transition:all 0.25s}.close.svelte-1invh97 > .button:hover{transform:rotate(90deg)}.modal-content.svelte-1invh97{flex:auto;display:flex;justify-content:center;align-items:center}");
 }
 
 // (145:0) {#if visible}
@@ -3606,7 +3604,7 @@ function create_if_block$5(ctx) {
 		c() {
 			div = element("div");
 			create_component(button.$$.fragment);
-			attr(div, "class", "modal svelte-1vrjevr");
+			attr(div, "class", "modal svelte-1invh97");
 			attr(div, "role", "dialog");
 			attr(div, "aria-modal", "true");
 			attr(div, "style", div_style_value = "" + /*pos*/ ctx[16] + " " + /*marginStyle*/ ctx[14] + " " + ElasticityStyle[/*overwriteElasticity*/ ctx[17]] + "");
@@ -3684,7 +3682,7 @@ function create_if_block_1$1(ctx) {
 		c() {
 			div = element("div");
 			create_component(button.$$.fragment);
-			attr(div, "class", "close svelte-1vrjevr");
+			attr(div, "class", "close svelte-1invh97");
 			set_style(div, "z-index", /*$maximumZindex*/ ctx[20] + 1);
 		},
 		m(target, anchor) {
@@ -3773,7 +3771,7 @@ function create_default_slot$6(ctx) {
 			t = space();
 			div = element("div");
 			if (default_slot) default_slot.c();
-			attr(div, "class", "modal-content svelte-1vrjevr");
+			attr(div, "class", "modal-content svelte-1invh97");
 			attr(div, "style", /*_style*/ ctx[4]);
 		},
 		m(target, anchor) {
@@ -4264,7 +4262,7 @@ class Grid extends SvelteComponent {
 /* src/components/GridItem.svelte generated by Svelte v3.53.1 */
 
 function add_css$p(target) {
-	append_styles(target, "svelte-1cryhmb", ".grid-item.svelte-1cryhmb{word-break:break-all;position:relative}.grid-item-inner.svelte-1cryhmb{position:absolute;inset:0}");
+	append_styles(target, "svelte-n7kdl3", ".grid-item.svelte-n7kdl3{word-break:break-all;position:relative}.grid-item-inner.svelte-n7kdl3{position:absolute;inset:0}");
 }
 
 function create_fragment$r(ctx) {
@@ -4279,8 +4277,8 @@ function create_fragment$r(ctx) {
 			div1 = element("div");
 			div0 = element("div");
 			if (default_slot) default_slot.c();
-			attr(div0, "class", "grid-item-inner svelte-1cryhmb");
-			attr(div1, "class", "grid-item svelte-1cryhmb");
+			attr(div0, "class", "grid-item-inner svelte-n7kdl3");
+			attr(div1, "class", "grid-item svelte-n7kdl3");
 			attr(div1, "data-element-id", /*gridItemId*/ ctx[0]);
 			attr(div1, "data-grid-item-id", /*gridItemId*/ ctx[0]);
 			attr(div1, "style", /*_style*/ ctx[1]);
@@ -4585,7 +4583,7 @@ class RenderText extends SvelteComponent {
 /* src/components/TextElement.svelte generated by Svelte v3.53.1 */
 
 function add_css$o(target) {
-	append_styles(target, "svelte-hffkvs", ".text-element-wrapper.svelte-hffkvs.svelte-hffkvs{position:relative;height:100%}.text-element.svelte-hffkvs.svelte-hffkvs{display:flex;position:relative;width:100%;height:100%;box-sizing:border-box;white-space:pre-wrap;overflow:auto;margin:0px;padding:0px;border-width:0px;border-style:solid;border-color:#000000}.text-link-element.svelte-hffkvs.svelte-hffkvs{text-decoration:none;color:inherit}.text-element-inner.svelte-hffkvs.svelte-hffkvs{width:100%;height:auto}.text-direction-vertical.svelte-hffkvs.svelte-hffkvs{writing-mode:vertical-rl}.text-direction-vertical.svelte-hffkvs .text-element-inner.svelte-hffkvs{width:auto;height:100%}.tooltip.svelte-hffkvs.svelte-hffkvs{display:none;position:absolute;bottom:-40px;left:50%;transform:translateX(-50%);color:#fff;background-color:#3d4948;white-space:nowrap;padding:4px 8px 4px 8px;border-radius:4px;font-size:12px;z-index:2147483647}.tooltip.svelte-hffkvs.svelte-hffkvs:before{content:'';position:absolute;top:-13px;left:50%;margin-left:-7px;border:7px solid transparent;border-bottom:7px solid #3d4948}.tooltip.show.svelte-hffkvs.svelte-hffkvs{display:block}.tooltip-error.svelte-hffkvs.svelte-hffkvs{background-color:#c00}.tooltip-error.svelte-hffkvs.svelte-hffkvs:before{border-bottom:7px solid #c00}");
+	append_styles(target, "svelte-zde5p8", ".text-element-wrapper.svelte-zde5p8.svelte-zde5p8{position:relative;height:100%}.text-element.svelte-zde5p8.svelte-zde5p8{display:flex;position:relative;width:100%;height:100%;box-sizing:border-box;white-space:pre-wrap;overflow:auto;margin:0px;padding:0px;border-width:0px;border-style:solid;border-color:#000000}.text-link-element.svelte-zde5p8.svelte-zde5p8{text-decoration:none;color:inherit}.text-element-inner.svelte-zde5p8.svelte-zde5p8{width:100%;height:auto}.text-direction-vertical.svelte-zde5p8.svelte-zde5p8{writing-mode:vertical-rl}.text-direction-vertical.svelte-zde5p8 .text-element-inner.svelte-zde5p8{width:auto;height:100%}.tooltip.svelte-zde5p8.svelte-zde5p8{display:none;position:absolute;bottom:-40px;left:50%;transform:translateX(-50%);color:#fff;background-color:#3d4948;white-space:nowrap;padding:4px 8px 4px 8px;border-radius:4px;font-size:12px;z-index:2147483647}.tooltip.svelte-zde5p8.svelte-zde5p8:before{content:'';position:absolute;top:-13px;left:50%;margin-left:-7px;border:7px solid transparent;border-bottom:7px solid #3d4948}.tooltip.show.svelte-zde5p8.svelte-zde5p8{display:block}.tooltip-error.svelte-zde5p8.svelte-zde5p8{background-color:#c00}.tooltip-error.svelte-zde5p8.svelte-zde5p8:before{border-bottom:7px solid #c00}");
 }
 
 // (86:2) {:else}
@@ -4602,8 +4600,8 @@ function create_else_block$1(ctx) {
 			div1 = element("div");
 			div0 = element("div");
 			create_component(rendertext.$$.fragment);
-			attr(div0, "class", "text-element-inner svelte-hffkvs");
-			attr(div1, "class", div1_class_value = "" + (null_to_empty(`text-element text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-hffkvs"));
+			attr(div0, "class", "text-element-inner svelte-zde5p8");
+			attr(div1, "class", div1_class_value = "" + (null_to_empty(`text-element text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-zde5p8"));
 			attr(div1, "style", /*style*/ ctx[5]);
 		},
 		m(target, anchor) {
@@ -4617,7 +4615,7 @@ function create_else_block$1(ctx) {
 			if (dirty & /*text*/ 1) rendertext_changes.text = /*text*/ ctx[0];
 			rendertext.$set(rendertext_changes);
 
-			if (!current || dirty & /*textDirection*/ 2 && div1_class_value !== (div1_class_value = "" + (null_to_empty(`text-element text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-hffkvs"))) {
+			if (!current || dirty & /*textDirection*/ 2 && div1_class_value !== (div1_class_value = "" + (null_to_empty(`text-element text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-zde5p8"))) {
 				attr(div1, "class", div1_class_value);
 			}
 
@@ -4667,12 +4665,12 @@ function create_if_block$3(ctx) {
 			t2 = space();
 			div2 = element("div");
 			div2.textContent = "コピーできませんでした";
-			attr(div0, "class", "text-element-inner svelte-hffkvs");
+			attr(div0, "class", "text-element-inner svelte-zde5p8");
 			attr(a, "href", '');
-			attr(a, "class", a_class_value = "" + (null_to_empty(`text-element text-link-element text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-hffkvs"));
+			attr(a, "class", a_class_value = "" + (null_to_empty(`text-element text-link-element text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-zde5p8"));
 			attr(a, "style", /*style*/ ctx[5]);
-			attr(div1, "class", "tooltip svelte-hffkvs");
-			attr(div2, "class", "tooltip tooltip-error svelte-hffkvs");
+			attr(div1, "class", "tooltip svelte-zde5p8");
+			attr(div2, "class", "tooltip tooltip-error svelte-zde5p8");
 		},
 		m(target, anchor) {
 			insert(target, a, anchor);
@@ -4696,7 +4694,7 @@ function create_if_block$3(ctx) {
 			if (dirty & /*text*/ 1) rendertext_changes.text = /*text*/ ctx[0];
 			rendertext.$set(rendertext_changes);
 
-			if (!current || dirty & /*textDirection*/ 2 && a_class_value !== (a_class_value = "" + (null_to_empty(`text-element text-link-element text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-hffkvs"))) {
+			if (!current || dirty & /*textDirection*/ 2 && a_class_value !== (a_class_value = "" + (null_to_empty(`text-element text-link-element text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-zde5p8"))) {
 				attr(a, "class", a_class_value);
 			}
 
@@ -4748,7 +4746,7 @@ function create_fragment$p(ctx) {
 		c() {
 			div = element("div");
 			if_block.c();
-			attr(div, "class", "text-element-wrapper svelte-hffkvs");
+			attr(div, "class", "text-element-wrapper svelte-zde5p8");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -4913,7 +4911,7 @@ class TextElement extends SvelteComponent {
 /* src/components/TextButtonElement.svelte generated by Svelte v3.53.1 */
 
 function add_css$n(target) {
-	append_styles(target, "svelte-1ijl494", ".text-button-element.svelte-1ijl494{width:100%;height:100%}.text-button-element.svelte-1ijl494 > .button{display:flex;justify-content:center;align-items:center;width:100%;height:100%;background-color:transparent;border:none;box-shadow:transparent;box-sizing:border-box;cursor:pointer;transition:box-shadow 0.2s;white-space:pre-wrap;overflow:hidden}.text-button-element.svelte-1ijl494 > .button._disabled{cursor:not-allowed !important;opacity:0.2}.text-button-element.svelte-1ijl494 > .button:not(._disabled):active{box-shadow:inset 0 0 100px 100px rgba(0, 0, 0, 0.3)}.text-button-element.svelte-1ijl494 > .button:not(._disabled):hover{box-shadow:inset 0 0 100px 100px rgba(255, 255, 255, 0.3)}");
+	append_styles(target, "svelte-wb7ek", ".text-button-element.svelte-wb7ek{width:100%;height:100%}.text-button-element.svelte-wb7ek > .button{display:flex;justify-content:center;align-items:center;width:100%;height:100%;background-color:transparent;border:none;box-shadow:transparent;box-sizing:border-box;cursor:pointer;transition:box-shadow 0.2s;white-space:pre-wrap;overflow:hidden}.text-button-element.svelte-wb7ek > .button._disabled{cursor:not-allowed !important;opacity:0.2}.text-button-element.svelte-wb7ek > .button:not(._disabled):active{box-shadow:inset 0 0 100px 100px rgba(0, 0, 0, 0.3)}.text-button-element.svelte-wb7ek > .button:not(._disabled):hover{box-shadow:inset 0 0 100px 100px rgba(255, 255, 255, 0.3)}");
 }
 
 // (46:2) <Button onClick={onClick} {style} {eventName}>
@@ -4969,7 +4967,7 @@ function create_fragment$o(ctx) {
 		c() {
 			div = element("div");
 			create_component(button.$$.fragment);
-			attr(div, "class", "text-button-element svelte-1ijl494");
+			attr(div, "class", "text-button-element svelte-wb7ek");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -5061,22 +5059,23 @@ class TextButtonElement extends SvelteComponent {
 /* src/components/ImageElement.svelte generated by Svelte v3.53.1 */
 
 function add_css$m(target) {
-	append_styles(target, "svelte-185kah0", ".image-element.svelte-185kah0{width:100%;height:100%;max-width:100%;max-height:100%;box-sizing:border-box}.image-element.svelte-185kah0 > .button{display:flex;position:relative;width:100%;height:100%;max-width:100%;max-height:100%;justify-content:center;align-items:center;white-space:nowrap;box-sizing:border-box;overflow:hidden}.image-element.svelte-185kah0 > .button._disabled{cursor:not-allowed !important;opacity:0.2}.image-element.transport.svelte-185kah0 > .button:not(._disabled):hover,.image-element.transport.svelte-185kah0 > .button:not(._disabled):focus{opacity:0.75;box-shadow:0 5px 16px rgba(0, 0, 0, 0.1), 0 8px 28px rgba(0, 0, 0, 0.16)}.image.svelte-185kah0{width:100%;height:100%}");
+	append_styles(target, "svelte-1v4alzq", ".image-element.svelte-1v4alzq{width:100%;height:100%;max-width:100%;max-height:100%;box-sizing:border-box}.image-element.svelte-1v4alzq > .button{display:flex;position:relative;width:100%;height:100%;max-width:100%;max-height:100%;justify-content:center;align-items:center;white-space:nowrap;box-sizing:border-box;overflow:hidden}.image-element.svelte-1v4alzq > .button._disabled{cursor:not-allowed !important;opacity:0.2}.image-element.transport.svelte-1v4alzq > .button:not(._disabled):hover,.image-element.transport.svelte-1v4alzq > .button:not(._disabled):focus{opacity:0.75;box-shadow:0 5px 16px rgba(0, 0, 0, 0.1), 0 8px 28px rgba(0, 0, 0, 0.16)}.image.svelte-1v4alzq{width:100%;height:100%}");
 }
 
-// (40:2) <Button {onClick} style={_style} {eventName}>
+// (44:2) <Button {onClick} style={_style} {eventName}>
 function create_default_slot$4(ctx) {
 	let img;
+	let img_style_value;
 	let img_src_value;
 
 	return {
 		c() {
 			img = element("img");
-			attr(img, "class", "image svelte-185kah0");
+			attr(img, "class", "image svelte-1v4alzq");
 			attr(img, "loading", "lazy");
 			attr(img, "width", "auto");
 			attr(img, "height", "auto");
-			attr(img, "style", /*_imageStyle*/ ctx[5]);
+			attr(img, "style", img_style_value = `${/*_imageStyle*/ ctx[6]} object-fit: ${/*objectFit*/ ctx[3]};`);
 			if (!src_url_equal(img.src, img_src_value = /*src*/ ctx[0])) attr(img, "src", img_src_value);
 			attr(img, "alt", /*alt*/ ctx[1]);
 		},
@@ -5084,8 +5083,8 @@ function create_default_slot$4(ctx) {
 			insert(target, img, anchor);
 		},
 		p(ctx, dirty) {
-			if (dirty & /*_imageStyle*/ 32) {
-				attr(img, "style", /*_imageStyle*/ ctx[5]);
+			if (dirty & /*_imageStyle, objectFit*/ 72 && img_style_value !== (img_style_value = `${/*_imageStyle*/ ctx[6]} object-fit: ${/*objectFit*/ ctx[3]};`)) {
+				attr(img, "style", img_style_value);
 			}
 
 			if (dirty & /*src*/ 1 && !src_url_equal(img.src, img_src_value = /*src*/ ctx[0])) {
@@ -5110,9 +5109,9 @@ function create_fragment$n(ctx) {
 
 	button = new Button({
 			props: {
-				onClick: /*onClick*/ ctx[3],
-				style: /*_style*/ ctx[6],
-				eventName: /*eventName*/ ctx[4],
+				onClick: /*onClick*/ ctx[4],
+				style: /*_style*/ ctx[7],
+				eventName: /*eventName*/ ctx[5],
 				$$slots: { default: [create_default_slot$4] },
 				$$scope: { ctx }
 			}
@@ -5122,7 +5121,7 @@ function create_fragment$n(ctx) {
 		c() {
 			div = element("div");
 			create_component(button.$$.fragment);
-			attr(div, "class", div_class_value = "image-element " + (/*transport*/ ctx[2] ? ' transport' : '') + " svelte-185kah0");
+			attr(div, "class", div_class_value = "image-element " + (/*transport*/ ctx[2] ? ' transport' : '') + " svelte-1v4alzq");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -5131,17 +5130,17 @@ function create_fragment$n(ctx) {
 		},
 		p(ctx, [dirty]) {
 			const button_changes = {};
-			if (dirty & /*onClick*/ 8) button_changes.onClick = /*onClick*/ ctx[3];
-			if (dirty & /*_style*/ 64) button_changes.style = /*_style*/ ctx[6];
-			if (dirty & /*eventName*/ 16) button_changes.eventName = /*eventName*/ ctx[4];
+			if (dirty & /*onClick*/ 16) button_changes.onClick = /*onClick*/ ctx[4];
+			if (dirty & /*_style*/ 128) button_changes.style = /*_style*/ ctx[7];
+			if (dirty & /*eventName*/ 32) button_changes.eventName = /*eventName*/ ctx[5];
 
-			if (dirty & /*$$scope, _imageStyle, src, alt*/ 163) {
+			if (dirty & /*$$scope, _imageStyle, objectFit, src, alt*/ 331) {
 				button_changes.$$scope = { dirty, ctx };
 			}
 
 			button.$set(button_changes);
 
-			if (!current || dirty & /*transport*/ 4 && div_class_value !== (div_class_value = "image-element " + (/*transport*/ ctx[2] ? ' transport' : '') + " svelte-185kah0")) {
+			if (!current || dirty & /*transport*/ 4 && div_class_value !== (div_class_value = "image-element " + (/*transport*/ ctx[2] ? ' transport' : '') + " svelte-1v4alzq")) {
 				attr(div, "class", div_class_value);
 			}
 		},
@@ -5165,22 +5164,24 @@ function instance$n($$self, $$props, $$invalidate) {
 	let { src = 'https://admin.karte.io/action-editor2/public/images/no_image_en.svg' } = $$props;
 	let { alt = 'No Image' } = $$props;
 	let { transport = false } = $$props;
+	let { objectFit = 'contain' } = $$props;
 	let { onClick = { operation: 'none', args: [] } } = $$props;
 	let { eventName = '' } = $$props;
-	let { _imageStyle = 'object-fit: contain;' } = $$props;
+	let { _imageStyle = '' } = $$props;
 	let { _style = 'border-width: 0px; border-style: solid; border-color: #000000;' } = $$props;
 
 	$$self.$$set = $$props => {
 		if ('src' in $$props) $$invalidate(0, src = $$props.src);
 		if ('alt' in $$props) $$invalidate(1, alt = $$props.alt);
 		if ('transport' in $$props) $$invalidate(2, transport = $$props.transport);
-		if ('onClick' in $$props) $$invalidate(3, onClick = $$props.onClick);
-		if ('eventName' in $$props) $$invalidate(4, eventName = $$props.eventName);
-		if ('_imageStyle' in $$props) $$invalidate(5, _imageStyle = $$props._imageStyle);
-		if ('_style' in $$props) $$invalidate(6, _style = $$props._style);
+		if ('objectFit' in $$props) $$invalidate(3, objectFit = $$props.objectFit);
+		if ('onClick' in $$props) $$invalidate(4, onClick = $$props.onClick);
+		if ('eventName' in $$props) $$invalidate(5, eventName = $$props.eventName);
+		if ('_imageStyle' in $$props) $$invalidate(6, _imageStyle = $$props._imageStyle);
+		if ('_style' in $$props) $$invalidate(7, _style = $$props._style);
 	};
 
-	return [src, alt, transport, onClick, eventName, _imageStyle, _style];
+	return [src, alt, transport, objectFit, onClick, eventName, _imageStyle, _style];
 }
 
 class ImageElement extends SvelteComponent {
@@ -5197,10 +5198,11 @@ class ImageElement extends SvelteComponent {
 				src: 0,
 				alt: 1,
 				transport: 2,
-				onClick: 3,
-				eventName: 4,
-				_imageStyle: 5,
-				_style: 6
+				objectFit: 3,
+				onClick: 4,
+				eventName: 5,
+				_imageStyle: 6,
+				_style: 7
 			},
 			add_css$m
 		);
@@ -5210,7 +5212,7 @@ class ImageElement extends SvelteComponent {
 /* src/components/List.svelte generated by Svelte v3.53.1 */
 
 function add_css$l(target) {
-	append_styles(target, "svelte-e4h4wn", ".list.svelte-e4h4wn{display:flex;width:100%;height:100%;overflow:hidden;border-width:0px;border-style:solid;border-color:#000000}");
+	append_styles(target, "svelte-1gh1zvv", ".list.svelte-1gh1zvv{display:flex;width:100%;height:100%;overflow:hidden;border-width:0px;border-style:solid;border-color:#000000}");
 }
 
 function create_fragment$m(ctx) {
@@ -5223,7 +5225,7 @@ function create_fragment$m(ctx) {
 		c() {
 			div = element("div");
 			if (default_slot) default_slot.c();
-			attr(div, "class", "list svelte-e4h4wn");
+			attr(div, "class", "list svelte-1gh1zvv");
 			attr(div, "style", /*style*/ ctx[0]);
 		},
 		m(target, anchor) {
@@ -5357,7 +5359,7 @@ class List extends SvelteComponent {
 /* src/components/ListItem.svelte generated by Svelte v3.53.1 */
 
 function add_css$k(target) {
-	append_styles(target, "svelte-1y59gb", ".list-item.svelte-1y59gb{flex:auto;box-sizing:border-box;min-width:0;min-height:0;position:relative}.list-item.svelte-1y59gb > .button{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000}");
+	append_styles(target, "svelte-pd7cyv", ".list-item.svelte-pd7cyv{flex:auto;box-sizing:border-box;min-width:0;min-height:0;position:relative}.list-item.svelte-pd7cyv > .button{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000}");
 }
 
 // (67:2) <Button {onClick} style={_style} eventName={clickEventName}>
@@ -5427,7 +5429,7 @@ function create_fragment$l(ctx) {
 		c() {
 			div = element("div");
 			create_component(button.$$.fragment);
-			attr(div, "class", "list-item svelte-1y59gb");
+			attr(div, "class", "list-item svelte-pd7cyv");
 			attr(div, "style", /*listItemStyle*/ ctx[3]);
 		},
 		m(target, anchor) {
@@ -5553,7 +5555,7 @@ class ListItem extends SvelteComponent {
 /* src/components/EmbedElement.svelte generated by Svelte v3.53.1 */
 
 function add_css$j(target) {
-	append_styles(target, "svelte-ni3m8w", ".embed.svelte-ni3m8w{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%}.embed.svelte-ni3m8w iframe{position:absolute;top:0;left:0;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000}");
+	append_styles(target, "svelte-g5f8hw", ".embed.svelte-g5f8hw{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%}.embed.svelte-g5f8hw iframe{position:absolute;top:0;left:0;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000}");
 }
 
 function create_fragment$k(ctx) {
@@ -5562,7 +5564,7 @@ function create_fragment$k(ctx) {
 	return {
 		c() {
 			div = element("div");
-			attr(div, "class", "embed svelte-ni3m8w");
+			attr(div, "class", "embed svelte-g5f8hw");
 			attr(div, "style", /*_style*/ ctx[1]);
 		},
 		m(target, anchor) {
@@ -5605,7 +5607,7 @@ class EmbedElement extends SvelteComponent {
 /* src/components/MovieYouTubeElement.svelte generated by Svelte v3.53.1 */
 
 function add_css$i(target) {
-	append_styles(target, "svelte-55gb6a", ".embed.svelte-55gb6a{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000}.embed.svelte-55gb6a iframe{position:absolute;top:0;left:0;width:100%;height:100%}");
+	append_styles(target, "svelte-1gvn5zq", ".embed.svelte-1gvn5zq{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000}.embed.svelte-1gvn5zq iframe{position:absolute;top:0;left:0;width:100%;height:100%}");
 }
 
 function create_fragment$j(ctx) {
@@ -5617,7 +5619,7 @@ function create_fragment$j(ctx) {
 			div1 = element("div");
 			div0 = element("div");
 			attr(div0, "class", "karte-player");
-			attr(div1, "class", "embed svelte-55gb6a");
+			attr(div1, "class", "embed svelte-1gvn5zq");
 			attr(div1, "style", /*_style*/ ctx[0]);
 		},
 		m(target, anchor) {
@@ -5959,7 +5961,7 @@ class MovieYouTubeElement extends SvelteComponent {
 /* src/components/MovieVimeoElement.svelte generated by Svelte v3.53.1 */
 
 function add_css$h(target) {
-	append_styles(target, "svelte-55gb6a", ".embed.svelte-55gb6a{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000}.embed.svelte-55gb6a iframe{position:absolute;top:0;left:0;width:100%;height:100%}");
+	append_styles(target, "svelte-1gvn5zq", ".embed.svelte-1gvn5zq{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000}.embed.svelte-1gvn5zq iframe{position:absolute;top:0;left:0;width:100%;height:100%}");
 }
 
 function create_fragment$i(ctx) {
@@ -5971,7 +5973,7 @@ function create_fragment$i(ctx) {
 			div1 = element("div");
 			div0 = element("div");
 			attr(div0, "class", "karte-player");
-			attr(div1, "class", "embed svelte-55gb6a");
+			attr(div1, "class", "embed svelte-1gvn5zq");
 			attr(div1, "style", /*_style*/ ctx[0]);
 		},
 		m(target, anchor) {
@@ -6155,7 +6157,7 @@ class MovieVimeoElement extends SvelteComponent {
 /* src/components/FormTextarea.svelte generated by Svelte v3.53.1 */
 
 function add_css$g(target) {
-	append_styles(target, "svelte-13z4kn0", ".textarea-wrapper.svelte-13z4kn0{display:flex;align-items:center;width:100%;height:100%}.textarea.svelte-13z4kn0{width:100%;resize:none}");
+	append_styles(target, "svelte-kyay3k", ".textarea-wrapper.svelte-kyay3k{display:flex;align-items:center;width:100%;height:100%}.textarea.svelte-kyay3k{width:100%;resize:none}");
 }
 
 function create_fragment$h(ctx) {
@@ -6168,12 +6170,12 @@ function create_fragment$h(ctx) {
 		c() {
 			div = element("div");
 			textarea = element("textarea");
-			attr(textarea, "class", "textarea svelte-13z4kn0");
+			attr(textarea, "class", "textarea svelte-kyay3k");
 			textarea.value = /*$value*/ ctx[3];
 			textarea.required = /*required*/ ctx[0];
 			attr(textarea, "rows", /*rows*/ ctx[1]);
 			attr(textarea, "placeholder", /*placeholder*/ ctx[2]);
-			attr(div, "class", "textarea-wrapper svelte-13z4kn0");
+			attr(div, "class", "textarea-wrapper svelte-kyay3k");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -6269,7 +6271,7 @@ class FormTextarea extends SvelteComponent {
 /* src/components/FormRadioButtons.svelte generated by Svelte v3.53.1 */
 
 function add_css$f(target) {
-	append_styles(target, "svelte-1ntb6j8", ".radio-buttons.svelte-1ntb6j8{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%}.radio-button.svelte-1ntb6j8{cursor:pointer;display:flex;align-items:center}.radio-button-input.svelte-1ntb6j8{appearance:none;margin:0;box-sizing:border-box;border-radius:var(--size);position:relative;width:var(--size);height:var(--size);border:solid calc(var(--size) / 3) var(--color-main);background-color:var(--color-sub);cursor:pointer;flex:none}.radio-button-input.svelte-1ntb6j8:checked{border:solid calc(var(--size) / 3) var(--color-main-active);background-color:var(--color-sub-active);box-shadow:0px 1px 8px 2px rgba(18,160,160,.08),0px 1px 4px -1px rgba(18,160,160,.24)}.radio-button-text.svelte-1ntb6j8{margin-left:0.5em}");
+	append_styles(target, "svelte-17s08g", ".radio-buttons.svelte-17s08g{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%}.radio-button.svelte-17s08g{cursor:pointer;display:flex;align-items:center}.radio-button-input.svelte-17s08g{appearance:none;margin:0;box-sizing:border-box;border-radius:var(--size);position:relative;width:var(--size);height:var(--size);border:solid calc(var(--size) / 3) var(--color-main);background-color:var(--color-sub);cursor:pointer;flex:none}.radio-button-input.svelte-17s08g:checked{border:solid calc(var(--size) / 3) var(--color-main-active);background-color:var(--color-sub-active);box-shadow:0px 1px 8px 2px rgba(18,160,160,.08),0px 1px 4px -1px rgba(18,160,160,.24)}.radio-button-text.svelte-17s08g{margin-left:0.5em}");
 }
 
 function get_each_context$5(ctx, list, i) {
@@ -6302,14 +6304,14 @@ function create_each_block$5(ctx) {
 			t1 = text(t1_value);
 			t2 = space();
 			attr(input, "type", "radio");
-			attr(input, "class", "radio-button-input svelte-1ntb6j8");
+			attr(input, "class", "radio-button-input svelte-17s08g");
 			attr(input, "style", /*buttonStyle*/ ctx[5]);
 			attr(input, "name", /*name*/ ctx[0]);
 			input.value = input_value_value = /*option*/ ctx[16];
 			input.checked = input_checked_value = /*option*/ ctx[16] === /*_value*/ ctx[3];
-			attr(span, "class", "radio-button-text svelte-1ntb6j8");
+			attr(span, "class", "radio-button-text svelte-17s08g");
 			attr(span, "style", /*_textStyle*/ ctx[2]);
-			attr(label, "class", "radio-button svelte-1ntb6j8");
+			attr(label, "class", "radio-button svelte-17s08g");
 		},
 		m(target, anchor) {
 			insert(target, label, anchor);
@@ -6374,7 +6376,7 @@ function create_fragment$g(ctx) {
 				each_blocks[i].c();
 			}
 
-			attr(div, "class", "radio-buttons svelte-1ntb6j8");
+			attr(div, "class", "radio-buttons svelte-17s08g");
 			attr(div, "style", /*_layoutStyle*/ ctx[1]);
 		},
 		m(target, anchor) {
@@ -6541,7 +6543,7 @@ class FormRadioButtons extends SvelteComponent {
 /* src/components/FormSelect.svelte generated by Svelte v3.53.1 */
 
 function add_css$e(target) {
-	append_styles(target, "svelte-1ihv110", ".select.svelte-1ihv110{width:100%;height:100%}.select-select.svelte-1ihv110{position:relative;appearance:none;width:100%;height:100%}.select-select.svelte-1ihv110:focus{outline:none;border-width:var(--focus-border-width) !important;border-color:var(--focus-border-color) !important;border-style:var(--focus-border-style) !important}.select-icon.svelte-1ihv110{position:absolute;width:calc(var(--icon-size) / 1.41);height:calc(var(--icon-size) / 1.41);top:calc(50% - calc(var(--icon-size) / 4));right:calc(var(--icon-size) * 1.2);box-sizing:border-box;border-right:solid 2px var(--icon-color);border-top:solid 2px var(--icon-color);transform:translateY(-35.4%) rotate(135deg);pointer-events:none}");
+	append_styles(target, "svelte-1n4ag74", ".select.svelte-1n4ag74{width:100%;height:100%}.select-select.svelte-1n4ag74{position:relative;appearance:none;width:100%;height:100%}.select-select.svelte-1n4ag74:focus{outline:none;border-width:var(--focus-border-width) !important;border-color:var(--focus-border-color) !important;border-style:var(--focus-border-style) !important}.select-icon.svelte-1n4ag74{position:absolute;width:calc(var(--icon-size) / 1.41);height:calc(var(--icon-size) / 1.41);top:calc(50% - calc(var(--icon-size) / 4));right:calc(var(--icon-size) * 1.2);box-sizing:border-box;border-right:solid 2px var(--icon-color);border-top:solid 2px var(--icon-color);transform:translateY(-35.4%) rotate(135deg);pointer-events:none}");
 }
 
 function get_each_context$4(ctx, list, i) {
@@ -6675,10 +6677,10 @@ function create_fragment$f(ctx) {
 
 			t = space();
 			div0 = element("div");
-			attr(select, "class", "select-select svelte-1ihv110");
+			attr(select, "class", "select-select svelte-1n4ag74");
 			attr(select, "style", /*style*/ ctx[3]);
-			attr(div0, "class", "select-icon svelte-1ihv110");
-			attr(div1, "class", "select svelte-1ihv110");
+			attr(div0, "class", "select-icon svelte-1n4ag74");
+			attr(div1, "class", "select svelte-1n4ag74");
 			attr(div1, "style", /*styleVariables*/ ctx[2]);
 		},
 		m(target, anchor) {
@@ -6880,7 +6882,7 @@ class FormSelect extends SvelteComponent {
 /* src/components/FormCheckBoxes.svelte generated by Svelte v3.53.1 */
 
 function add_css$d(target) {
-	append_styles(target, "svelte-wtt98v", ".check-boxes.svelte-wtt98v.svelte-wtt98v{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%}.check-box.svelte-wtt98v.svelte-wtt98v{display:flex;align-items:center;position:relative;cursor:pointer}.check-box-input.svelte-wtt98v.svelte-wtt98v{width:var(--size);height:var(--size);margin:0;position:absolute;appearance:none;cursor:pointer}.check-box-check.svelte-wtt98v.svelte-wtt98v{display:inline-flex;background-color:var(--color-main);width:var(--size);height:var(--size);border-radius:calc(var(--size) / 4);justify-content:center;align-items:center;flex:none}.check-box-icon.svelte-wtt98v.svelte-wtt98v{display:inline-block;--icon-size:calc(var(--size) * 3 / 4);width:var(--icon-size);height:var(--icon-size)}.check-box-icon.svelte-wtt98v.svelte-wtt98v:after{content:'';display:block;box-sizing:border-box;width:45%;height:91%;transform:translate(60%, -8%) rotate(45deg);border-style:none solid solid none;border-width:2px;border-color:var(--color-sub)}.check-box-check._checked.svelte-wtt98v.svelte-wtt98v{background-color:var(--color-main-active)}.check-box-check._checked.svelte-wtt98v .check-box-icon.svelte-wtt98v:after{border-color:var(--color-sub-active)}.check-box-text.svelte-wtt98v.svelte-wtt98v{margin-left:0.5em}");
+	append_styles(target, "svelte-p15pvn", ".check-boxes.svelte-p15pvn.svelte-p15pvn{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%}.check-box.svelte-p15pvn.svelte-p15pvn{display:flex;align-items:center;position:relative;cursor:pointer}.check-box-input.svelte-p15pvn.svelte-p15pvn{width:var(--size);height:var(--size);margin:0;position:absolute;appearance:none;cursor:pointer}.check-box-check.svelte-p15pvn.svelte-p15pvn{display:inline-flex;background-color:var(--color-main);width:var(--size);height:var(--size);border-radius:calc(var(--size) / 4);justify-content:center;align-items:center;flex:none}.check-box-icon.svelte-p15pvn.svelte-p15pvn{display:inline-block;--icon-size:calc(var(--size) * 3 / 4);width:var(--icon-size);height:var(--icon-size)}.check-box-icon.svelte-p15pvn.svelte-p15pvn:after{content:'';display:block;box-sizing:border-box;width:45%;height:91%;transform:translate(60%, -8%) rotate(45deg);border-style:none solid solid none;border-width:2px;border-color:var(--color-sub)}.check-box-check._checked.svelte-p15pvn.svelte-p15pvn{background-color:var(--color-main-active)}.check-box-check._checked.svelte-p15pvn .check-box-icon.svelte-p15pvn:after{border-color:var(--color-sub-active)}.check-box-text.svelte-p15pvn.svelte-p15pvn{margin-left:0.5em}");
 }
 
 function get_each_context$3(ctx, list, i) {
@@ -6918,19 +6920,19 @@ function create_each_block$3(ctx) {
 			span2 = element("span");
 			t2 = text(t2_value);
 			t3 = space();
-			attr(input, "class", "check-box-input svelte-wtt98v");
+			attr(input, "class", "check-box-input svelte-p15pvn");
 			attr(input, "type", "checkbox");
 			attr(input, "name", /*name*/ ctx[0]);
 			input.checked = input_checked_value = /*isCheckedArray*/ ctx[4][/*i*/ ctx[19]];
-			attr(span0, "class", "check-box-icon svelte-wtt98v");
+			attr(span0, "class", "check-box-icon svelte-p15pvn");
 
 			attr(span1, "class", span1_class_value = "" + (null_to_empty(`check-box-check${/*isCheckedArray*/ ctx[4][/*i*/ ctx[19]]
 			? ' _checked'
-			: ''}`) + " svelte-wtt98v"));
+			: ''}`) + " svelte-p15pvn"));
 
-			attr(span2, "class", "check-box-text svelte-wtt98v");
+			attr(span2, "class", "check-box-text svelte-p15pvn");
 			attr(span2, "style", /*_textStyle*/ ctx[2]);
-			attr(label, "class", "check-box svelte-wtt98v");
+			attr(label, "class", "check-box svelte-p15pvn");
 			attr(label, "style", /*styleVariables*/ ctx[5]);
 		},
 		m(target, anchor) {
@@ -6962,7 +6964,7 @@ function create_each_block$3(ctx) {
 
 			if (dirty & /*isCheckedArray*/ 16 && span1_class_value !== (span1_class_value = "" + (null_to_empty(`check-box-check${/*isCheckedArray*/ ctx[4][/*i*/ ctx[19]]
 			? ' _checked'
-			: ''}`) + " svelte-wtt98v"))) {
+			: ''}`) + " svelte-p15pvn"))) {
 				attr(span1, "class", span1_class_value);
 			}
 
@@ -7001,7 +7003,7 @@ function create_fragment$e(ctx) {
 				each_blocks[i].c();
 			}
 
-			attr(div, "class", "check-boxes svelte-wtt98v");
+			attr(div, "class", "check-boxes svelte-p15pvn");
 			attr(div, "style", /*_layoutStyle*/ ctx[1]);
 		},
 		m(target, anchor) {
@@ -7175,7 +7177,7 @@ class FormCheckBoxes extends SvelteComponent {
 /* src/components/FormRatingButtonsNumber.svelte generated by Svelte v3.53.1 */
 
 function add_css$c(target) {
-	append_styles(target, "svelte-18pfy31", ".rating-buttons.svelte-18pfy31{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%}.rating-button.svelte-18pfy31{cursor:pointer;display:flex;justify-content:center;align-items:center;transition:background-color 0.2s, box-shadow 0.2s;appearance:none;background:none;border:none;margin:0;padding:0}");
+	append_styles(target, "svelte-zy2va9", ".rating-buttons.svelte-zy2va9{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%}.rating-button.svelte-zy2va9{cursor:pointer;display:flex;justify-content:center;align-items:center;transition:background-color 0.2s, box-shadow 0.2s;appearance:none;background:none;border:none;margin:0;padding:0}");
 }
 
 function get_each_context$2(ctx, list, i) {
@@ -7199,7 +7201,7 @@ function create_each_block$2(ctx) {
 			button = element("button");
 			t0 = text(t0_value);
 			t1 = space();
-			attr(button, "class", "rating-button svelte-18pfy31");
+			attr(button, "class", "rating-button svelte-zy2va9");
 			attr(button, "style", button_style_value = /*getTextButtonStyle*/ ctx[4](/*i*/ ctx[12] === /*_value*/ ctx[1]));
 		},
 		m(target, anchor) {
@@ -7248,7 +7250,7 @@ function create_fragment$d(ctx) {
 				each_blocks[i].c();
 			}
 
-			attr(div, "class", "rating-buttons svelte-18pfy31");
+			attr(div, "class", "rating-buttons svelte-zy2va9");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -7385,7 +7387,7 @@ class FormRatingButtonsNumber extends SvelteComponent {
 /* src/components/FormRatingButtonsFace.svelte generated by Svelte v3.53.1 */
 
 function add_css$b(target) {
-	append_styles(target, "svelte-1b5dvzw", ".rating-buttons.svelte-1b5dvzw{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%}.rating-button.svelte-1b5dvzw{appearance:none;background:none;border:none;margin:0;padding:0}.rating-button-image.svelte-1b5dvzw{cursor:pointer;user-select:none;-webkit-user-drag:none;width:100%;height:100%}.rating-button-image.svelte-1b5dvzw:not(._active){filter:grayscale(100%)}");
+	append_styles(target, "svelte-tbunko", ".rating-buttons.svelte-tbunko{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%}.rating-button.svelte-tbunko{appearance:none;background:none;border:none;margin:0;padding:0}.rating-button-image.svelte-tbunko{cursor:pointer;user-select:none;-webkit-user-drag:none;width:100%;height:100%}.rating-button-image.svelte-tbunko:not(._active){filter:grayscale(100%)}");
 }
 
 function get_each_context$1(ctx, list, i) {
@@ -7410,9 +7412,9 @@ function create_each_block$1(ctx) {
 			img = element("img");
 			t = space();
 			if (!src_url_equal(img.src, img_src_value = /*ICONS*/ ctx[2][/*i*/ ctx[10]])) attr(img, "src", img_src_value);
-			attr(img, "class", img_class_value = "" + (null_to_empty(`rating-button-image${/*i*/ ctx[10] === /*_value*/ ctx[1] ? ' _active' : ''}`) + " svelte-1b5dvzw"));
+			attr(img, "class", img_class_value = "" + (null_to_empty(`rating-button-image${/*i*/ ctx[10] === /*_value*/ ctx[1] ? ' _active' : ''}`) + " svelte-tbunko"));
 			attr(img, "alt", "rate" + /*i*/ ctx[10]);
-			attr(button, "class", "rating-button svelte-1b5dvzw");
+			attr(button, "class", "rating-button svelte-tbunko");
 			attr(button, "style", /*buttonStyle*/ ctx[0]);
 		},
 		m(target, anchor) {
@@ -7428,7 +7430,7 @@ function create_each_block$1(ctx) {
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 
-			if (dirty & /*_value*/ 2 && img_class_value !== (img_class_value = "" + (null_to_empty(`rating-button-image${/*i*/ ctx[10] === /*_value*/ ctx[1] ? ' _active' : ''}`) + " svelte-1b5dvzw"))) {
+			if (dirty & /*_value*/ 2 && img_class_value !== (img_class_value = "" + (null_to_empty(`rating-button-image${/*i*/ ctx[10] === /*_value*/ ctx[1] ? ' _active' : ''}`) + " svelte-tbunko"))) {
 				attr(img, "class", img_class_value);
 			}
 
@@ -7461,7 +7463,7 @@ function create_fragment$c(ctx) {
 				each_blocks[i].c();
 			}
 
-			attr(div, "class", "rating-buttons svelte-1b5dvzw");
+			attr(div, "class", "rating-buttons svelte-tbunko");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -7569,7 +7571,7 @@ class FormRatingButtonsFace extends SvelteComponent {
 /* src/components/Slide.svelte generated by Svelte v3.53.1 */
 
 function add_css$a(target) {
-	append_styles(target, "svelte-1qfq79t", ".root.svelte-1qfq79t{width:100%;height:100%;position:relative}.container.svelte-1qfq79t{width:100%;height:100%;position:relative;overflow:hidden;box-sizing:border-box;border-width:0px;border-style:solid;border-color:#000000}.slide.svelte-1qfq79t{height:100%;position:absolute;display:flex}.transition.svelte-1qfq79t{transition:left 0.2s cubic-bezier(.04,.67,.53,.96)}.item.svelte-1qfq79t{height:100%;flex:none}.prev-button-container.svelte-1qfq79t,.next-button-container.svelte-1qfq79t{top:50%;height:0;position:absolute;display:flex;overflow:visible;align-items:center}.prev-button-container.svelte-1qfq79t{left:0}.next-button-container.svelte-1qfq79t{right:0}.move-button.svelte-1qfq79t{display:flex;align-items:center;justify-content:center;cursor:pointer;box-sizing:border-box;border:none;background:none;margin:0;padding:0}.navigation.svelte-1qfq79t{position:absolute;width:0;left:50%;bottom:0;display:flex;justify-content:center;overflow:visible}.navigation-item.svelte-1qfq79t{flex-shrink:0;cursor:pointer;border:none;background:none;margin:0;padding:0;appearance:none}.navigation-item-inner.circle.svelte-1qfq79t{border-radius:51%}");
+	append_styles(target, "svelte-ji1fh", ".root.svelte-ji1fh{width:100%;height:100%;position:relative}.container.svelte-ji1fh{width:100%;height:100%;position:relative;overflow:hidden;box-sizing:border-box;border-width:0px;border-style:solid;border-color:#000000}.slide.svelte-ji1fh{height:100%;position:absolute;display:flex}.transition.svelte-ji1fh{transition:left 0.2s cubic-bezier(.04,.67,.53,.96)}.item.svelte-ji1fh{height:100%;flex:none}.prev-button-container.svelte-ji1fh,.next-button-container.svelte-ji1fh{top:50%;height:0;position:absolute;display:flex;overflow:visible;align-items:center}.prev-button-container.svelte-ji1fh{left:0}.next-button-container.svelte-ji1fh{right:0}.move-button.svelte-ji1fh{display:flex;align-items:center;justify-content:center;cursor:pointer;box-sizing:border-box;border:none;background:none;margin:0;padding:0}.navigation.svelte-ji1fh{position:absolute;width:0;left:50%;bottom:0;display:flex;justify-content:center;overflow:visible}.navigation-item.svelte-ji1fh{flex-shrink:0;cursor:pointer;border:none;background:none;margin:0;padding:0;appearance:none}.navigation-item-inner.circle.svelte-ji1fh{border-radius:51%}");
 }
 
 function get_each_context(ctx, list, i) {
@@ -7598,9 +7600,9 @@ function create_if_block_1(ctx) {
 			attr(svg, "viewBox", "0 0 10 16");
 			attr(svg, "xmlns", "http://www.w3.org/2000/svg");
 			attr(svg, "style", /*prevIconStyle*/ ctx[10]);
-			attr(button, "class", "move-button svelte-1qfq79t");
+			attr(button, "class", "move-button svelte-ji1fh");
 			attr(button, "style", /*_prevButtonContainerStyle*/ ctx[9]);
-			attr(div, "class", "prev-button-container svelte-1qfq79t");
+			attr(div, "class", "prev-button-container svelte-ji1fh");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -7649,9 +7651,9 @@ function create_if_block$1(ctx) {
 			attr(svg, "viewBox", "0 0 10 16");
 			attr(svg, "xmlns", "http://www.w3.org/2000/svg");
 			attr(svg, "style", /*nextIconStyle*/ ctx[8]);
-			attr(button, "class", "move-button svelte-1qfq79t");
+			attr(button, "class", "move-button svelte-ji1fh");
 			attr(button, "style", /*_nextButtonContainerStyle*/ ctx[7]);
-			attr(div, "class", "next-button-container svelte-1qfq79t");
+			attr(div, "class", "next-button-container svelte-ji1fh");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -7699,9 +7701,9 @@ function create_each_block(ctx) {
 			button = element("button");
 			div = element("div");
 			t = space();
-			attr(div, "class", "navigation-item-inner circle svelte-1qfq79t");
+			attr(div, "class", "navigation-item-inner circle svelte-ji1fh");
 			attr(div, "style", div_style_value = /*getNavigationItemInnerStyle*/ ctx[5](/*i*/ ctx[63]));
-			attr(button, "class", "navigation-item svelte-1qfq79t");
+			attr(button, "class", "navigation-item svelte-ji1fh");
 			attr(button, "style", /*navigationItemStyle*/ ctx[6]);
 		},
 		m(target, anchor) {
@@ -7778,14 +7780,14 @@ function create_fragment$b(ctx) {
 				each_blocks[i].c();
 			}
 
-			attr(div0, "class", div0_class_value = "" + (null_to_empty(/*slideClass*/ ctx[13]) + " svelte-1qfq79t"));
+			attr(div0, "class", div0_class_value = "" + (null_to_empty(/*slideClass*/ ctx[13]) + " svelte-ji1fh"));
 			attr(div0, "style", /*slideStyle*/ ctx[14]);
-			attr(div1, "class", "container svelte-1qfq79t");
+			attr(div1, "class", "container svelte-ji1fh");
 			attr(div1, "style", /*_style*/ ctx[0]);
-			attr(div2, "class", "navigation svelte-1qfq79t");
+			attr(div2, "class", "navigation svelte-ji1fh");
 			attr(div2, "style", /*navigationStyle*/ ctx[4]);
 			set_attributes(div3, div3_data);
-			toggle_class(div3, "svelte-1qfq79t", true);
+			toggle_class(div3, "svelte-ji1fh", true);
 		},
 		m(target, anchor) {
 			insert(target, div3, anchor);
@@ -7827,7 +7829,7 @@ function create_fragment$b(ctx) {
 				}
 			}
 
-			if (!current || dirty[0] & /*slideClass*/ 8192 && div0_class_value !== (div0_class_value = "" + (null_to_empty(/*slideClass*/ ctx[13]) + " svelte-1qfq79t"))) {
+			if (!current || dirty[0] & /*slideClass*/ 8192 && div0_class_value !== (div0_class_value = "" + (null_to_empty(/*slideClass*/ ctx[13]) + " svelte-ji1fh"))) {
 				attr(div0, "class", div0_class_value);
 			}
 
@@ -7893,7 +7895,7 @@ function create_fragment$b(ctx) {
 			}
 
 			set_attributes(div3, div3_data = get_spread_update(div3_levels, [{ class: "root" }, dataAttrStopPropagation('click')]));
-			toggle_class(div3, "svelte-1qfq79t", true);
+			toggle_class(div3, "svelte-ji1fh", true);
 		},
 		i(local) {
 			if (current) return;
@@ -8405,7 +8407,7 @@ class Slide extends SvelteComponent {
 /* src/components/SlideItem.svelte generated by Svelte v3.53.1 */
 
 function add_css$9(target) {
-	append_styles(target, "svelte-1ilvo81", ".item.svelte-1ilvo81{height:100%;flex:none;position:relative}.item.svelte-1ilvo81 img{user-select:none;-webkit-user-drag:none}.item-inner.svelte-1ilvo81{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000}");
+	append_styles(target, "svelte-1fqq17x", ".item.svelte-1fqq17x{height:100%;flex:none;position:relative}.item.svelte-1fqq17x img{user-select:none;-webkit-user-drag:none}.item-inner.svelte-1fqq17x{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000}");
 }
 
 function create_fragment$a(ctx) {
@@ -8420,9 +8422,9 @@ function create_fragment$a(ctx) {
 			div1 = element("div");
 			div0 = element("div");
 			if (default_slot) default_slot.c();
-			attr(div0, "class", "item-inner svelte-1ilvo81");
+			attr(div0, "class", "item-inner svelte-1fqq17x");
 			attr(div0, "style", /*_style*/ ctx[0]);
-			attr(div1, "class", "item svelte-1ilvo81");
+			attr(div1, "class", "item svelte-1fqq17x");
 			attr(div1, "style", /*itemStyle*/ ctx[1]);
 		},
 		m(target, anchor) {
@@ -8548,7 +8550,7 @@ class SlideItem extends SvelteComponent {
 /* src/components/Countdown.svelte generated by Svelte v3.53.1 */
 
 function add_css$8(target) {
-	append_styles(target, "svelte-5j9cpu", ".countdown.svelte-5j9cpu{position:relative;width:100%;height:100%}.countdown-inner.svelte-5j9cpu{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000}");
+	append_styles(target, "svelte-192lor2", ".countdown.svelte-192lor2{position:relative;width:100%;height:100%}.countdown-inner.svelte-192lor2{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000}");
 }
 
 const get_default_slot_changes = dirty => ({ countdown: dirty & /*countdown*/ 2 });
@@ -8566,9 +8568,9 @@ function create_fragment$9(ctx) {
 			div1 = element("div");
 			div0 = element("div");
 			if (default_slot) default_slot.c();
-			attr(div0, "class", "countdown-inner svelte-5j9cpu");
+			attr(div0, "class", "countdown-inner svelte-192lor2");
 			attr(div0, "style", /*_style*/ ctx[0]);
-			attr(div1, "class", "countdown svelte-5j9cpu");
+			attr(div1, "class", "countdown svelte-192lor2");
 		},
 		m(target, anchor) {
 			insert(target, div1, anchor);
@@ -8702,7 +8704,7 @@ class Countdown extends SvelteComponent {
 /* src/components/Box.svelte generated by Svelte v3.53.1 */
 
 function add_css$7(target) {
-	append_styles(target, "svelte-ppc4fn", ".box.svelte-ppc4fn{position:relative;width:100%;height:100%}.box.svelte-ppc4fn > .button{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000}");
+	append_styles(target, "svelte-6g6etj", ".box.svelte-6g6etj{position:relative;width:100%;height:100%}.box.svelte-6g6etj > .button{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000}");
 }
 
 // (24:2) <Button {onClick} style={_style} {eventName}>
@@ -8772,7 +8774,7 @@ function create_fragment$8(ctx) {
 		c() {
 			div = element("div");
 			create_component(button.$$.fragment);
-			attr(div, "class", "box svelte-ppc4fn");
+			attr(div, "class", "box svelte-6g6etj");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -8833,7 +8835,7 @@ class Box extends SvelteComponent {
 /* src/components/IconElement.svelte generated by Svelte v3.53.1 */
 
 function add_css$6(target) {
-	append_styles(target, "svelte-1mk6wi4", ".icon.svelte-1mk6wi4{display:flex;justify-content:center;align-items:center;width:100%;height:100%}.icon.svelte-1mk6wi4 > .button{display:flex;position:relative;width:100%;height:100%;max-width:100%;max-height:100%;justify-content:center;align-items:center;white-space:nowrap;box-sizing:border-box;overflow:hidden}.icon.svelte-1mk6wi4 > .button._disabled{cursor:not-allowed !important;opacity:0.2}.icon.svelte-1mk6wi4 svg{width:var(--width);height:var(--height);color:var(--color);stroke:var(--stroke);fill:var(--fill)}");
+	append_styles(target, "svelte-1mkvcuo", ".icon.svelte-1mkvcuo{display:flex;justify-content:center;align-items:center;width:100%;height:100%}.icon.svelte-1mkvcuo > .button{display:flex;position:relative;width:100%;height:100%;max-width:100%;max-height:100%;justify-content:center;align-items:center;white-space:nowrap;box-sizing:border-box;overflow:hidden}.icon.svelte-1mkvcuo > .button._disabled{cursor:not-allowed !important;opacity:0.2}.icon.svelte-1mkvcuo svg{width:var(--width);height:var(--height);color:var(--color);stroke:var(--stroke);fill:var(--fill)}");
 }
 
 // (56:4) {#if svg}
@@ -8915,7 +8917,7 @@ function create_fragment$7(ctx) {
 		c() {
 			div = element("div");
 			create_component(button.$$.fragment);
-			attr(div, "class", "icon svelte-1mk6wi4");
+			attr(div, "class", "icon svelte-1mkvcuo");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -9024,7 +9026,7 @@ class IconElement extends SvelteComponent {
 /* src/components/CodeElement.svelte generated by Svelte v3.53.1 */
 
 function add_css$5(target) {
-	append_styles(target, "svelte-1ng2n51", ".codeElement.svelte-1ng2n51{box-sizing:border-box;margin:0px;padding:0px;width:100%;height:100%}");
+	append_styles(target, "svelte-ymsb9l", ".codeElement.svelte-ymsb9l{box-sizing:border-box;margin:0px;padding:0px;width:100%;height:100%}");
 }
 
 function create_fragment$6(ctx) {
@@ -9050,7 +9052,7 @@ function create_fragment$6(ctx) {
 		c() {
 			div = element("div");
 			if (switch_instance) create_component(switch_instance.$$.fragment);
-			attr(div, "class", "codeElement svelte-1ng2n51");
+			attr(div, "class", "codeElement svelte-ymsb9l");
 			attr(div, "style", /*style*/ ctx[3]);
 		},
 		m(target, anchor) {
@@ -9139,7 +9141,7 @@ class CodeElement extends SvelteComponent {
 /* src/components/Flex.svelte generated by Svelte v3.53.1 */
 
 function add_css$4(target) {
-	append_styles(target, "svelte-9v2qdg", ".flex.svelte-9v2qdg{display:flex}");
+	append_styles(target, "svelte-1e71ejc", ".flex.svelte-1e71ejc{display:flex}");
 }
 
 function create_fragment$5(ctx) {
@@ -9153,7 +9155,7 @@ function create_fragment$5(ctx) {
 		c() {
 			div = element("div");
 			if (default_slot) default_slot.c();
-			attr(div, "class", "flex svelte-9v2qdg");
+			attr(div, "class", "flex svelte-1e71ejc");
 			attr(div, "style", div_style_value = "width:" + /*width*/ ctx[1] + "; height:" + /*height*/ ctx[2] + "; flex-direction:" + /*direction*/ ctx[0] + "; " + /*_style*/ ctx[3]);
 		},
 		m(target, anchor) {
@@ -9250,7 +9252,7 @@ class Flex extends SvelteComponent {
 /* src/components/FlexItem.svelte generated by Svelte v3.53.1 */
 
 function add_css$3(target) {
-	append_styles(target, "svelte-164ah5d", ".flex-item.svelte-164ah5d{max-width:100%;max-height:100%;position:relative;isolation:isolate}");
+	append_styles(target, "svelte-1p0bk1x", ".flex-item.svelte-1p0bk1x{max-width:100%;max-height:100%;position:relative;isolation:isolate}");
 }
 
 function create_fragment$4(ctx) {
@@ -9263,7 +9265,7 @@ function create_fragment$4(ctx) {
 		c() {
 			div = element("div");
 			if (default_slot) default_slot.c();
-			attr(div, "class", "flex-item svelte-164ah5d");
+			attr(div, "class", "flex-item svelte-1p0bk1x");
 			attr(div, "style", /*style*/ ctx[0]);
 		},
 		m(target, anchor) {
@@ -9671,7 +9673,7 @@ class GridModalState extends SvelteComponent {
 /* src/components/TextBlock.svelte generated by Svelte v3.53.1 */
 
 function add_css$2(target) {
-	append_styles(target, "svelte-q1o685", ".text-block.svelte-q1o685.svelte-q1o685{display:flex;position:relative;width:100%;height:100%;box-sizing:border-box;white-space:pre-wrap;overflow:auto}.text-block-inner.svelte-q1o685.svelte-q1o685{width:100%;height:auto}.text-direction-vertical.svelte-q1o685.svelte-q1o685{writing-mode:vertical-rl}.text-direction-vertical.svelte-q1o685 .text-block-inner.svelte-q1o685{width:auto;height:100%}");
+	append_styles(target, "svelte-11rpuv5", ".text-block.svelte-11rpuv5.svelte-11rpuv5{display:flex;position:relative;width:100%;height:100%;box-sizing:border-box;white-space:pre-wrap;overflow:auto}.text-block-inner.svelte-11rpuv5.svelte-11rpuv5{width:100%;height:auto}.text-direction-vertical.svelte-11rpuv5.svelte-11rpuv5{writing-mode:vertical-rl}.text-direction-vertical.svelte-11rpuv5 .text-block-inner.svelte-11rpuv5{width:auto;height:100%}");
 }
 
 function create_fragment$2(ctx) {
@@ -9687,8 +9689,8 @@ function create_fragment$2(ctx) {
 			div1 = element("div");
 			div0 = element("div");
 			create_component(rendertext.$$.fragment);
-			attr(div0, "class", "text-block-inner svelte-q1o685");
-			attr(div1, "class", div1_class_value = "" + (null_to_empty(`text-block text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-q1o685"));
+			attr(div0, "class", "text-block-inner svelte-11rpuv5");
+			attr(div1, "class", div1_class_value = "" + (null_to_empty(`text-block text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-11rpuv5"));
 			attr(div1, "style", /*style*/ ctx[2]);
 		},
 		m(target, anchor) {
@@ -9702,7 +9704,7 @@ function create_fragment$2(ctx) {
 			if (dirty & /*text*/ 1) rendertext_changes.text = /*text*/ ctx[0];
 			rendertext.$set(rendertext_changes);
 
-			if (!current || dirty & /*textDirection*/ 2 && div1_class_value !== (div1_class_value = "" + (null_to_empty(`text-block text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-q1o685"))) {
+			if (!current || dirty & /*textDirection*/ 2 && div1_class_value !== (div1_class_value = "" + (null_to_empty(`text-block text-direction-${/*textDirection*/ ctx[1]}`) + " svelte-11rpuv5"))) {
 				attr(div1, "class", div1_class_value);
 			}
 
@@ -9780,7 +9782,7 @@ class TextBlock extends SvelteComponent {
 /* src/components/TextButtonBlock.svelte generated by Svelte v3.53.1 */
 
 function add_css$1(target) {
-	append_styles(target, "svelte-1cungpm", ".text-button-block.svelte-1cungpm{width:100%;height:100%}.text-button.svelte-1cungpm{display:flex;justify-content:center;align-items:center;width:100%;height:100%;background-color:transparent;border:none;box-shadow:transparent;box-sizing:border-box;cursor:pointer;transition:box-shadow 0.2s}.text-button.svelte-1cungpm:active{box-shadow:inset 0 0 100px 100px rgba(0, 0, 0, 0.3)}.text-button.svelte-1cungpm:hover{box-shadow:inset 0 0 100px 100px rgba(255, 255, 255, 0.3)}");
+	append_styles(target, "svelte-1t5i3za", ".text-button-block.svelte-1t5i3za{width:100%;height:100%}.text-button.svelte-1t5i3za{display:flex;justify-content:center;align-items:center;width:100%;height:100%;background-color:transparent;border:none;box-shadow:transparent;box-sizing:border-box;cursor:pointer;transition:box-shadow 0.2s}.text-button.svelte-1t5i3za:active{box-shadow:inset 0 0 100px 100px rgba(0, 0, 0, 0.3)}.text-button.svelte-1t5i3za:hover{box-shadow:inset 0 0 100px 100px rgba(255, 255, 255, 0.3)}");
 }
 
 function create_fragment$1(ctx) {
@@ -9797,9 +9799,9 @@ function create_fragment$1(ctx) {
 			div = element("div");
 			button = element("button");
 			create_component(rendertext.$$.fragment);
-			attr(button, "class", "text-button svelte-1cungpm");
+			attr(button, "class", "text-button svelte-1t5i3za");
 			attr(button, "style", /*_buttonStyle*/ ctx[1]);
-			attr(div, "class", "text-button-block svelte-1cungpm");
+			attr(div, "class", "text-button-block svelte-1t5i3za");
 			attr(div, "style", /*_style*/ ctx[2]);
 		},
 		m(target, anchor) {
@@ -9905,12 +9907,13 @@ class TextButtonBlock extends SvelteComponent {
 /* src/components/ImageBlock.svelte generated by Svelte v3.53.1 */
 
 function add_css(target) {
-	append_styles(target, "svelte-77bqvv", ".image-block.svelte-77bqvv{display:flex;position:relative;width:100%;height:100%;max-width:100%;max-height:100%;justify-content:center;align-items:center;white-space:nowrap;box-sizing:border-box;overflow:hidden}.image.svelte-77bqvv{width:100%;height:100%}.transport.svelte-77bqvv:hover,.transport.svelte-77bqvv:focus{opacity:0.75;box-shadow:0 5px 16px rgba(0, 0, 0, 0.1), 0 8px 28px rgba(0, 0, 0, 0.16)}");
+	append_styles(target, "svelte-1um32br", ".image-block.svelte-1um32br{display:flex;position:relative;width:100%;height:100%;max-width:100%;max-height:100%;justify-content:center;align-items:center;white-space:nowrap;box-sizing:border-box;overflow:hidden}.image.svelte-1um32br{width:100%;height:100%}.transport.svelte-1um32br:hover,.transport.svelte-1um32br:focus{opacity:0.75;box-shadow:0 5px 16px rgba(0, 0, 0, 0.1), 0 8px 28px rgba(0, 0, 0, 0.16)}");
 }
 
 function create_fragment(ctx) {
 	let div;
 	let img;
+	let img_style_value;
 	let img_src_value;
 	let div_class_value;
 	let mounted;
@@ -9920,28 +9923,28 @@ function create_fragment(ctx) {
 		c() {
 			div = element("div");
 			img = element("img");
-			attr(img, "class", "image svelte-77bqvv");
+			attr(img, "class", "image svelte-1um32br");
 			attr(img, "loading", "lazy");
 			attr(img, "width", "auto");
 			attr(img, "height", "auto");
-			attr(img, "style", /*_imageStyle*/ ctx[3]);
+			attr(img, "style", img_style_value = `${/*_imageStyle*/ ctx[4]} object-fit: ${/*objectFit*/ ctx[3]};`);
 			if (!src_url_equal(img.src, img_src_value = /*src*/ ctx[0])) attr(img, "src", img_src_value);
 			attr(img, "alt", /*alt*/ ctx[1]);
-			attr(div, "class", div_class_value = "" + (null_to_empty('image-block' + (/*transport*/ ctx[2] ? ' transport' : '')) + " svelte-77bqvv"));
-			attr(div, "style", /*_style*/ ctx[4]);
+			attr(div, "class", div_class_value = "" + (null_to_empty('image-block' + (/*transport*/ ctx[2] ? ' transport' : '')) + " svelte-1um32br"));
+			attr(div, "style", /*_style*/ ctx[5]);
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
 			append(div, img);
 
 			if (!mounted) {
-				dispose = listen(div, "click", /*click*/ ctx[5]);
+				dispose = listen(div, "click", /*click*/ ctx[6]);
 				mounted = true;
 			}
 		},
 		p(ctx, [dirty]) {
-			if (dirty & /*_imageStyle*/ 8) {
-				attr(img, "style", /*_imageStyle*/ ctx[3]);
+			if (dirty & /*_imageStyle, objectFit*/ 24 && img_style_value !== (img_style_value = `${/*_imageStyle*/ ctx[4]} object-fit: ${/*objectFit*/ ctx[3]};`)) {
+				attr(img, "style", img_style_value);
 			}
 
 			if (dirty & /*src*/ 1 && !src_url_equal(img.src, img_src_value = /*src*/ ctx[0])) {
@@ -9952,12 +9955,12 @@ function create_fragment(ctx) {
 				attr(img, "alt", /*alt*/ ctx[1]);
 			}
 
-			if (dirty & /*transport*/ 4 && div_class_value !== (div_class_value = "" + (null_to_empty('image-block' + (/*transport*/ ctx[2] ? ' transport' : '')) + " svelte-77bqvv"))) {
+			if (dirty & /*transport*/ 4 && div_class_value !== (div_class_value = "" + (null_to_empty('image-block' + (/*transport*/ ctx[2] ? ' transport' : '')) + " svelte-1um32br"))) {
 				attr(div, "class", div_class_value);
 			}
 
-			if (dirty & /*_style*/ 16) {
-				attr(div, "style", /*_style*/ ctx[4]);
+			if (dirty & /*_style*/ 32) {
+				attr(div, "style", /*_style*/ ctx[5]);
 			}
 		},
 		i: noop,
@@ -9974,6 +9977,7 @@ function instance($$self, $$props, $$invalidate) {
 	let { src = 'https://admin.karte.io/action-editor2/public/images/no_image_en.svg' } = $$props;
 	let { alt = 'No Image' } = $$props;
 	let { transport = false } = $$props;
+	let { objectFit = 'contain' } = $$props;
 	let { onClick = { operation: 'none', args: [] } } = $$props;
 
 	const click = () => {
@@ -9985,20 +9989,21 @@ function instance($$self, $$props, $$invalidate) {
 	};
 
 	let { eventName = '' } = $$props;
-	let { _imageStyle = 'object-fit: contain;' } = $$props;
+	let { _imageStyle = '' } = $$props;
 	let { _style = '' } = $$props;
 
 	$$self.$$set = $$props => {
 		if ('src' in $$props) $$invalidate(0, src = $$props.src);
 		if ('alt' in $$props) $$invalidate(1, alt = $$props.alt);
 		if ('transport' in $$props) $$invalidate(2, transport = $$props.transport);
-		if ('onClick' in $$props) $$invalidate(6, onClick = $$props.onClick);
-		if ('eventName' in $$props) $$invalidate(7, eventName = $$props.eventName);
-		if ('_imageStyle' in $$props) $$invalidate(3, _imageStyle = $$props._imageStyle);
-		if ('_style' in $$props) $$invalidate(4, _style = $$props._style);
+		if ('objectFit' in $$props) $$invalidate(3, objectFit = $$props.objectFit);
+		if ('onClick' in $$props) $$invalidate(7, onClick = $$props.onClick);
+		if ('eventName' in $$props) $$invalidate(8, eventName = $$props.eventName);
+		if ('_imageStyle' in $$props) $$invalidate(4, _imageStyle = $$props._imageStyle);
+		if ('_style' in $$props) $$invalidate(5, _style = $$props._style);
 	};
 
-	return [src, alt, transport, _imageStyle, _style, click, onClick, eventName];
+	return [src, alt, transport, objectFit, _imageStyle, _style, click, onClick, eventName];
 }
 
 class ImageBlock extends SvelteComponent {
@@ -10015,10 +10020,11 @@ class ImageBlock extends SvelteComponent {
 				src: 0,
 				alt: 1,
 				transport: 2,
-				onClick: 6,
-				eventName: 7,
-				_imageStyle: 3,
-				_style: 4
+				objectFit: 3,
+				onClick: 7,
+				eventName: 8,
+				_imageStyle: 4,
+				_style: 5
 			},
 			add_css
 		);