@plaidev/karte-action-sdk 1.1.255-28810509.aa4fd817 → 1.1.255-28830850.ad94289f

package/dist/hydrate/index.es.js

@@ -16217,10 +16217,10 @@ class CloseButton extends SvelteComponent {
 /* src/components-flex/image/Image.svelte generated by Svelte v3.53.1 */
 
 function add_css$7(target) {
-	append_styles(target, "svelte-1jfwn73", ".image.svelte-1jfwn73{max-width:100%;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center}.image-object.svelte-1jfwn73{width:100%;overflow:hidden}.image-img.svelte-1jfwn73{vertical-align:top;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}");
+	append_styles(target, "svelte-10a9nyt", ".image.svelte-10a9nyt{max-width:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}.image-object.svelte-10a9nyt{width:100%;overflow:hidden}.image-img.svelte-10a9nyt{vertical-align:top;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}");
 }
 
-// (19:0) <svelte:element   {...attributes}   this={element}   class="image"   style={style}   data-layer-id={layerId}   on:click={handleClick} >
+// (19:0) <svelte:element   this={element}   {...attributes}   class="image"   {style}   data-layer-id={layerId}   on:click={handleClick} >
 function create_dynamic_element$2(ctx) {
 	let svelte_element;
 	let object;
@@ -16268,9 +16268,9 @@ function create_dynamic_element$2(ctx) {
 		h() {
 			if (!src_url_equal(img.src, img_src_value = /*props*/ ctx[0].image)) attr(img, "src", img_src_value);
 			attr(img, "alt", img_alt_value = /*props*/ ctx[0].alt);
-			attr(img, "class", "image-img svelte-1jfwn73");
+			attr(img, "class", "image-img svelte-10a9nyt");
 			attr(object, "style", /*objectStyle*/ ctx[2]);
-			attr(object, "class", "image-object svelte-1jfwn73");
+			attr(object, "class", "image-object svelte-10a9nyt");
 
 			if ((/-/).test(/*element*/ ctx[5])) {
 				set_custom_element_data_map(svelte_element, svelte_element_data);
@@ -16278,7 +16278,7 @@ function create_dynamic_element$2(ctx) {
 				set_attributes(svelte_element, svelte_element_data);
 			}
 
-			toggle_class(svelte_element, "svelte-1jfwn73", true);
+			toggle_class(svelte_element, "svelte-10a9nyt", true);
 		},
 		m(target, anchor) {
 			insert_hydration(target, svelte_element, anchor);
@@ -16316,7 +16316,7 @@ function create_dynamic_element$2(ctx) {
 				set_attributes(svelte_element, svelte_element_data);
 			}
 
-			toggle_class(svelte_element, "svelte-1jfwn73", true);
+			toggle_class(svelte_element, "svelte-10a9nyt", true);
 		},
 		d(detaching) {
 			if (detaching) detach(svelte_element);
@@ -17803,19 +17803,19 @@ function add_css$1(target) {
 	append_styles(target, "svelte-45ue06", "*{box-sizing:border-box}.modal.svelte-45ue06{position:fixed;z-index:2147483647;display:flex}.modal.svelte-45ue06 > .button{flex:auto;display:flex}@media screen and (min-width: 641px){.modal-bp.svelte-45ue06{height:var(--modal-bp-height-pc) !important;width:var(--modal-bp-width-pc) !important;top:var(--modal-bp-top-pc) !important;left:var(--modal-bp-left-pc) !important;bottom:var(--modal-bp-bottom-pc) !important;right:var(--modal-bp-right-pc) !important;transform:var(--modal-bp-transform-pc);margin:var(--modal-bp-margin-pc) !important}.background-bp-pc{display:block}.background-bp-sp{display:none}}@media screen and (max-width: 640px){.modal-bp.svelte-45ue06{height:var(--modal-bp-height-sp) !important;width:var(--modal-bp-width-sp) !important;top:var(--modal-bp-top-sp) !important;left:var(--modal-bp-left-sp) !important;bottom:var(--modal-bp-bottom-sp) !important;right:var(--modal-bp-right-sp) !important;transform:var(--modal-bp-transform-sp);margin:var(--modal-bp-margin-sp) !important}.background-bp-pc{display:none}.background-bp-sp{display:block}}");
 }
 
-// (219:0) {:else}
+// (220:0) {:else}
 function create_else_block(ctx) {
 	let backgroundoverlay;
 	let current;
 
 	backgroundoverlay = new BackgroundOverlay({
 			props: {
-				backgroundOverlay: /*backgroundOverlay*/ ctx[3]
+				backgroundOverlay: /*backgroundOverlay*/ ctx[4]
 			}
 		});
 
 	backgroundoverlay.$on("click", function () {
-		if (is_function(/*backgroundClick*/ ctx[11])) /*backgroundClick*/ ctx[11].apply(this, arguments);
+		if (is_function(/*backgroundClick*/ ctx[12])) /*backgroundClick*/ ctx[12].apply(this, arguments);
 	});
 
 	return {
@@ -17832,7 +17832,7 @@ function create_else_block(ctx) {
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 			const backgroundoverlay_changes = {};
-			if (dirty & /*backgroundOverlay*/ 8) backgroundoverlay_changes.backgroundOverlay = /*backgroundOverlay*/ ctx[3];
+			if (dirty & /*backgroundOverlay*/ 16) backgroundoverlay_changes.backgroundOverlay = /*backgroundOverlay*/ ctx[4];
 			backgroundoverlay.$set(backgroundoverlay_changes);
 		},
 		i(local) {
@@ -17850,7 +17850,7 @@ function create_else_block(ctx) {
 	};
 }
 
-// (208:24) 
+// (209:24) 
 function create_if_block_2(ctx) {
 	let backgroundoverlay0;
 	let t;
@@ -17860,23 +17860,23 @@ function create_if_block_2(ctx) {
 	backgroundoverlay0 = new BackgroundOverlay({
 			props: {
 				class: "background-bp-pc",
-				backgroundOverlay: /*backgroundOverlayPC*/ ctx[4]
+				backgroundOverlay: /*backgroundOverlayPC*/ ctx[5]
 			}
 		});
 
 	backgroundoverlay0.$on("click", function () {
-		if (is_function(/*backgroundClickPC*/ ctx[10])) /*backgroundClickPC*/ ctx[10].apply(this, arguments);
+		if (is_function(/*backgroundClickPC*/ ctx[11])) /*backgroundClickPC*/ ctx[11].apply(this, arguments);
 	});
 
 	backgroundoverlay1 = new BackgroundOverlay({
 			props: {
 				class: "background-bp-sp ",
-				backgroundOverlay: /*backgroundOverlaySP*/ ctx[5]
+				backgroundOverlay: /*backgroundOverlaySP*/ ctx[6]
 			}
 		});
 
 	backgroundoverlay1.$on("click", function () {
-		if (is_function(/*backgroundClickSP*/ ctx[9])) /*backgroundClickSP*/ ctx[9].apply(this, arguments);
+		if (is_function(/*backgroundClickSP*/ ctx[10])) /*backgroundClickSP*/ ctx[10].apply(this, arguments);
 	});
 
 	return {
@@ -17899,10 +17899,10 @@ function create_if_block_2(ctx) {
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 			const backgroundoverlay0_changes = {};
-			if (dirty & /*backgroundOverlayPC*/ 16) backgroundoverlay0_changes.backgroundOverlay = /*backgroundOverlayPC*/ ctx[4];
+			if (dirty & /*backgroundOverlayPC*/ 32) backgroundoverlay0_changes.backgroundOverlay = /*backgroundOverlayPC*/ ctx[5];
 			backgroundoverlay0.$set(backgroundoverlay0_changes);
 			const backgroundoverlay1_changes = {};
-			if (dirty & /*backgroundOverlaySP*/ 32) backgroundoverlay1_changes.backgroundOverlay = /*backgroundOverlaySP*/ ctx[5];
+			if (dirty & /*backgroundOverlaySP*/ 64) backgroundoverlay1_changes.backgroundOverlay = /*backgroundOverlaySP*/ ctx[6];
 			backgroundoverlay1.$set(backgroundoverlay1_changes);
 		},
 		i(local) {
@@ -17924,7 +17924,7 @@ function create_if_block_2(ctx) {
 	};
 }
 
-// (206:0) {#if isPreview()}
+// (207:0) {#if isPreview()}
 function create_if_block_1(ctx) {
 	return {
 		c: noop,
@@ -17937,14 +17937,14 @@ function create_if_block_1(ctx) {
 	};
 }
 
-// (222:0) {#if visible}
+// (223:0) {#if visible}
 function create_if_block(ctx) {
 	let div;
 	let div_class_value;
 	let div_intro;
 	let current;
-	const default_slot_template = /*#slots*/ ctx[23].default;
-	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[22], null);
+	const default_slot_template = /*#slots*/ ctx[24].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[23], null);
 
 	return {
 		c() {
@@ -17957,6 +17957,7 @@ function create_if_block(ctx) {
 				class: true,
 				role: true,
 				"aria-modal": true,
+				"data-layer-id": true,
 				style: true
 			});
 
@@ -17969,7 +17970,8 @@ function create_if_block(ctx) {
 			attr(div, "class", div_class_value = "" + (null_to_empty(['modal', /*useBreakPoint*/ ctx[0] ? 'modal-bp' : ''].join(' ')) + " svelte-45ue06"));
 			attr(div, "role", "dialog");
 			attr(div, "aria-modal", "true");
-			attr(div, "style", Array.from(/*modalStyles*/ ctx[12]).join(';'));
+			attr(div, "data-layer-id", /*layerId*/ ctx[2]);
+			attr(div, "style", Array.from(/*modalStyles*/ ctx[13]).join(';'));
 		},
 		m(target, anchor) {
 			insert_hydration(target, div, anchor);
@@ -17978,22 +17980,22 @@ function create_if_block(ctx) {
 				default_slot.m(div, null);
 			}
 
-			/*div_binding*/ ctx[24](div);
+			/*div_binding*/ ctx[25](div);
 			current = true;
 		},
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 
 			if (default_slot) {
-				if (default_slot.p && (!current || dirty & /*$$scope*/ 4194304)) {
+				if (default_slot.p && (!current || dirty & /*$$scope*/ 8388608)) {
 					update_slot_base(
 						default_slot,
 						default_slot_template,
 						ctx,
-						/*$$scope*/ ctx[22],
+						/*$$scope*/ ctx[23],
 						!current
-						? get_all_dirty_from_scope(/*$$scope*/ ctx[22])
-						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[22], dirty, null),
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[23])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[23], dirty, null),
 						null
 					);
 				}
@@ -18002,6 +18004,10 @@ function create_if_block(ctx) {
 			if (!current || dirty & /*useBreakPoint*/ 1 && div_class_value !== (div_class_value = "" + (null_to_empty(['modal', /*useBreakPoint*/ ctx[0] ? 'modal-bp' : ''].join(' ')) + " svelte-45ue06"))) {
 				attr(div, "class", div_class_value);
 			}
+
+			if (!current || dirty & /*layerId*/ 4) {
+				attr(div, "data-layer-id", /*layerId*/ ctx[2]);
+			}
 		},
 		i(local) {
 			if (current) return;
@@ -18010,7 +18016,7 @@ function create_if_block(ctx) {
 			if (!div_intro) {
 				add_render_callback(() => {
 					div_intro = create_in_transition(div, customAnimation, {
-						transforms: /*transforms*/ ctx[2],
+						transforms: /*transforms*/ ctx[3],
 						animationStyle: /*animation*/ ctx[1]
 					});
 
@@ -18027,7 +18033,7 @@ function create_if_block(ctx) {
 		d(detaching) {
 			if (detaching) detach(div);
 			if (default_slot) default_slot.d(detaching);
-			/*div_binding*/ ctx[24](null);
+			/*div_binding*/ ctx[25](null);
 		}
 	};
 }
@@ -18053,7 +18059,7 @@ function create_fragment$1(ctx) {
 
 	current_block_type_index = select_block_type(ctx);
 	if_block0 = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
-	let if_block1 = /*visible*/ ctx[7] && create_if_block(ctx);
+	let if_block1 = /*visible*/ ctx[8] && create_if_block(ctx);
 
 	return {
 		c() {
@@ -18077,7 +18083,7 @@ function create_fragment$1(ctx) {
 
 			if (!mounted) {
 				dispose = listen(window, "keydown", function () {
-					if (is_function(/*handle_keydown*/ ctx[8])) /*handle_keydown*/ ctx[8].apply(this, arguments);
+					if (is_function(/*handle_keydown*/ ctx[9])) /*handle_keydown*/ ctx[9].apply(this, arguments);
 				});
 
 				mounted = true;
@@ -18111,11 +18117,11 @@ function create_fragment$1(ctx) {
 				if_block0.m(t.parentNode, t);
 			}
 
-			if (/*visible*/ ctx[7]) {
+			if (/*visible*/ ctx[8]) {
 				if (if_block1) {
 					if_block1.p(ctx, dirty);
 
-					if (dirty & /*visible*/ 128) {
+					if (dirty & /*visible*/ 256) {
 						transition_in(if_block1, 1);
 					}
 				} else {
@@ -18171,6 +18177,7 @@ function instance$1($$self, $$props, $$invalidate) {
 	let { animation = 'none' } = $$props;
 	let { closeEventName = '' } = $$props;
 	let { closeEventValue = null } = $$props;
+	let { layerId = '' } = $$props;
 
 	// モーダル背景の設定
 	placement && placement.backgroundOverlay !== undefined;
@@ -18189,7 +18196,7 @@ function instance$1($$self, $$props, $$invalidate) {
 	let modal;
 
 	onMount$1(() => {
-		$$invalidate(7, visible = true);
+		$$invalidate(8, visible = true);
 	});
 
 	onDestroy$1(() => setPreviousFocus());
@@ -18197,24 +18204,25 @@ function instance$1($$self, $$props, $$invalidate) {
 	function div_binding($$value) {
 		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
 			modal = $$value;
-			$$invalidate(6, modal);
+			$$invalidate(7, modal);
 		});
 	}
 
 	$$self.$$set = $$props => {
 		if ('useBreakPoint' in $$props) $$invalidate(0, useBreakPoint = $$props.useBreakPoint);
-		if ('placement' in $$props) $$invalidate(13, placement = $$props.placement);
-		if ('breakPoint' in $$props) $$invalidate(14, breakPoint = $$props.breakPoint);
-		if ('elasticity' in $$props) $$invalidate(15, elasticity = $$props.elasticity);
+		if ('placement' in $$props) $$invalidate(14, placement = $$props.placement);
+		if ('breakPoint' in $$props) $$invalidate(15, breakPoint = $$props.breakPoint);
+		if ('elasticity' in $$props) $$invalidate(16, elasticity = $$props.elasticity);
 		if ('animation' in $$props) $$invalidate(1, animation = $$props.animation);
-		if ('closeEventName' in $$props) $$invalidate(16, closeEventName = $$props.closeEventName);
-		if ('closeEventValue' in $$props) $$invalidate(17, closeEventValue = $$props.closeEventValue);
-		if ('$$scope' in $$props) $$invalidate(22, $$scope = $$props.$$scope);
+		if ('closeEventName' in $$props) $$invalidate(17, closeEventName = $$props.closeEventName);
+		if ('closeEventValue' in $$props) $$invalidate(18, closeEventValue = $$props.closeEventValue);
+		if ('layerId' in $$props) $$invalidate(2, layerId = $$props.layerId);
+		if ('$$scope' in $$props) $$invalidate(23, $$scope = $$props.$$scope);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue*/ 196608) {
-			$$invalidate(21, close = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue*/ 393216) {
+			$$invalidate(22, close = () => {
 				const onClose = { operation: 'closeApp', args: ['button'] };
 
 				if (closeEventName) {
@@ -18225,42 +18233,42 @@ function instance$1($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 24577) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 49153) {
 			{
 
 				if (useBreakPoint) {
 					const pc = breakPoint?.PC?.placement?.backgroundOverlay;
-					$$invalidate(4, backgroundOverlayPC = pc ?? false);
+					$$invalidate(5, backgroundOverlayPC = pc ?? false);
 					const sp = breakPoint?.SP?.placement?.backgroundOverlay;
-					$$invalidate(5, backgroundOverlaySP = sp ?? false);
+					$$invalidate(6, backgroundOverlaySP = sp ?? false);
 				}
 			}
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 24577) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 49153) {
 			{
 				if (placement && placement.backgroundClick) {
-					$$invalidate(18, backgroundClickFunction = placement.backgroundClick);
+					$$invalidate(19, backgroundClickFunction = placement.backgroundClick);
 				}
 
 				if (useBreakPoint) {
 					const pc = breakPoint?.PC?.placement?.backgroundClick;
 
 					if (pc) {
-						$$invalidate(19, backgroundClickFunctionPC = pc);
+						$$invalidate(20, backgroundClickFunctionPC = pc);
 					}
 
 					const sp = breakPoint?.SP?.placement?.backgroundClick;
 
 					if (sp) {
-						$$invalidate(20, backgroundClickFunctionSP = sp);
+						$$invalidate(21, backgroundClickFunctionSP = sp);
 					}
 				}
 			}
 		}
 
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunction*/ 458752) {
-			$$invalidate(11, backgroundClick = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunction*/ 917504) {
+			$$invalidate(12, backgroundClick = () => {
 				if (closeEventName) {
 					send_event(closeEventName, closeEventValue);
 				}
@@ -18269,8 +18277,8 @@ function instance$1($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionPC*/ 720896) {
-			$$invalidate(10, backgroundClickPC = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionPC*/ 1441792) {
+			$$invalidate(11, backgroundClickPC = () => {
 				if (closeEventName) {
 					send_event(closeEventName, closeEventValue);
 				}
@@ -18279,8 +18287,8 @@ function instance$1($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionSP*/ 1245184) {
-			$$invalidate(9, backgroundClickSP = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionSP*/ 2490368) {
+			$$invalidate(10, backgroundClickSP = () => {
 				if (closeEventName) {
 					send_event(closeEventName, closeEventValue);
 				}
@@ -18289,7 +18297,7 @@ function instance$1($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint, transforms*/ 24581) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint, transforms*/ 49161) {
 			// 表示位置のスタイルとアニメーションの動きを設定
 			{
 				// 表示位置のスタイルの設定
@@ -18301,7 +18309,7 @@ function instance$1($$self, $$props, $$invalidate) {
 					modalStyles.add(positionStyle);
 				}
 
-				$$invalidate(2, transforms = []);
+				$$invalidate(3, transforms = []);
 
 				DEVICE_IDS.forEach(deviceId => {
 
@@ -18319,7 +18327,7 @@ function instance$1($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 24577) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 49153) {
 			// 表示位置の調整のスタイルを設定
 			{
 				let margin = DefaultModalPlacement.margin;
@@ -18343,7 +18351,7 @@ function instance$1($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*elasticity, useBreakPoint, breakPoint*/ 49153) {
+		if ($$self.$$.dirty & /*elasticity, useBreakPoint, breakPoint*/ 98305) {
 			// 拡大方法のスタイルを設定
 			{
 				let elasticStyle = ElasticityStyle['none' ];
@@ -18365,19 +18373,20 @@ function instance$1($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*close*/ 2097152) {
-			$$invalidate(8, handle_keydown = handleKeydown({ Escape: close }));
+		if ($$self.$$.dirty & /*close*/ 4194304) {
+			$$invalidate(9, handle_keydown = handleKeydown({ Escape: close }));
 		}
 	};
 
-	$$invalidate(6, modal = null);
+	$$invalidate(7, modal = null);
 
 	// svelteコンポーネントのアニメーションを発火させるためにマウント時にvisibleをtrueにする。
-	$$invalidate(7, visible = false);
+	$$invalidate(8, visible = false);
 
 	return [
 		useBreakPoint,
 		animation,
+		layerId,
 		transforms,
 		backgroundOverlay,
 		backgroundOverlayPC,
@@ -18416,12 +18425,13 @@ class Modal extends SvelteComponent {
 			safe_not_equal,
 			{
 				useBreakPoint: 0,
-				placement: 13,
-				breakPoint: 14,
-				elasticity: 15,
+				placement: 14,
+				breakPoint: 15,
+				elasticity: 16,
 				animation: 1,
-				closeEventName: 16,
-				closeEventValue: 17
+				closeEventName: 17,
+				closeEventValue: 18,
+				layerId: 2
 			},
 			add_css$1
 		);

package/dist/index.es.js

@@ -15012,10 +15012,10 @@ class CloseButton extends SvelteComponent {
 /* src/components-flex/image/Image.svelte generated by Svelte v3.53.1 */
 
 function add_css$7(target) {
-	append_styles(target, "svelte-1jfwn73", ".image.svelte-1jfwn73{max-width:100%;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center}.image-object.svelte-1jfwn73{width:100%;overflow:hidden}.image-img.svelte-1jfwn73{vertical-align:top;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}");
+	append_styles(target, "svelte-10a9nyt", ".image.svelte-10a9nyt{max-width:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}.image-object.svelte-10a9nyt{width:100%;overflow:hidden}.image-img.svelte-10a9nyt{vertical-align:top;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}");
 }
 
-// (19:0) <svelte:element   {...attributes}   this={element}   class="image"   style={style}   data-layer-id={layerId}   on:click={handleClick} >
+// (19:0) <svelte:element   this={element}   {...attributes}   class="image"   {style}   data-layer-id={layerId}   on:click={handleClick} >
 function create_dynamic_element$2(ctx) {
 	let svelte_element;
 	let object;
@@ -15045,9 +15045,9 @@ function create_dynamic_element$2(ctx) {
 			img = element("img");
 			if (!src_url_equal(img.src, img_src_value = /*props*/ ctx[0].image)) attr(img, "src", img_src_value);
 			attr(img, "alt", img_alt_value = /*props*/ ctx[0].alt);
-			attr(img, "class", "image-img svelte-1jfwn73");
+			attr(img, "class", "image-img svelte-10a9nyt");
 			attr(object, "style", /*objectStyle*/ ctx[2]);
-			attr(object, "class", "image-object svelte-1jfwn73");
+			attr(object, "class", "image-object svelte-10a9nyt");
 
 			if ((/-/).test(/*element*/ ctx[5])) {
 				set_custom_element_data_map(svelte_element, svelte_element_data);
@@ -15055,7 +15055,7 @@ function create_dynamic_element$2(ctx) {
 				set_attributes(svelte_element, svelte_element_data);
 			}
 
-			toggle_class(svelte_element, "svelte-1jfwn73", true);
+			toggle_class(svelte_element, "svelte-10a9nyt", true);
 		},
 		m(target, anchor) {
 			insert(target, svelte_element, anchor);
@@ -15093,7 +15093,7 @@ function create_dynamic_element$2(ctx) {
 				set_attributes(svelte_element, svelte_element_data);
 			}
 
-			toggle_class(svelte_element, "svelte-1jfwn73", true);
+			toggle_class(svelte_element, "svelte-10a9nyt", true);
 		},
 		d(detaching) {
 			if (detaching) detach(svelte_element);
@@ -16474,19 +16474,19 @@ function add_css$1(target) {
 	append_styles(target, "svelte-45ue06", "*{box-sizing:border-box}.modal.svelte-45ue06{position:fixed;z-index:2147483647;display:flex}.modal.svelte-45ue06 > .button{flex:auto;display:flex}@media screen and (min-width: 641px){.modal-bp.svelte-45ue06{height:var(--modal-bp-height-pc) !important;width:var(--modal-bp-width-pc) !important;top:var(--modal-bp-top-pc) !important;left:var(--modal-bp-left-pc) !important;bottom:var(--modal-bp-bottom-pc) !important;right:var(--modal-bp-right-pc) !important;transform:var(--modal-bp-transform-pc);margin:var(--modal-bp-margin-pc) !important}.background-bp-pc{display:block}.background-bp-sp{display:none}}@media screen and (max-width: 640px){.modal-bp.svelte-45ue06{height:var(--modal-bp-height-sp) !important;width:var(--modal-bp-width-sp) !important;top:var(--modal-bp-top-sp) !important;left:var(--modal-bp-left-sp) !important;bottom:var(--modal-bp-bottom-sp) !important;right:var(--modal-bp-right-sp) !important;transform:var(--modal-bp-transform-sp);margin:var(--modal-bp-margin-sp) !important}.background-bp-pc{display:none}.background-bp-sp{display:block}}");
 }
 
-// (219:0) {:else}
+// (220:0) {:else}
 function create_else_block(ctx) {
 	let backgroundoverlay;
 	let current;
 
 	backgroundoverlay = new BackgroundOverlay({
 			props: {
-				backgroundOverlay: /*backgroundOverlay*/ ctx[3]
+				backgroundOverlay: /*backgroundOverlay*/ ctx[4]
 			}
 		});
 
 	backgroundoverlay.$on("click", function () {
-		if (is_function(/*backgroundClick*/ ctx[11])) /*backgroundClick*/ ctx[11].apply(this, arguments);
+		if (is_function(/*backgroundClick*/ ctx[12])) /*backgroundClick*/ ctx[12].apply(this, arguments);
 	});
 
 	return {
@@ -16500,7 +16500,7 @@ function create_else_block(ctx) {
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 			const backgroundoverlay_changes = {};
-			if (dirty & /*backgroundOverlay*/ 8) backgroundoverlay_changes.backgroundOverlay = /*backgroundOverlay*/ ctx[3];
+			if (dirty & /*backgroundOverlay*/ 16) backgroundoverlay_changes.backgroundOverlay = /*backgroundOverlay*/ ctx[4];
 			backgroundoverlay.$set(backgroundoverlay_changes);
 		},
 		i(local) {
@@ -16518,7 +16518,7 @@ function create_else_block(ctx) {
 	};
 }
 
-// (208:24) 
+// (209:24) 
 function create_if_block_2(ctx) {
 	let backgroundoverlay0;
 	let t;
@@ -16528,23 +16528,23 @@ function create_if_block_2(ctx) {
 	backgroundoverlay0 = new BackgroundOverlay({
 			props: {
 				class: "background-bp-pc",
-				backgroundOverlay: /*backgroundOverlayPC*/ ctx[4]
+				backgroundOverlay: /*backgroundOverlayPC*/ ctx[5]
 			}
 		});
 
 	backgroundoverlay0.$on("click", function () {
-		if (is_function(/*backgroundClickPC*/ ctx[10])) /*backgroundClickPC*/ ctx[10].apply(this, arguments);
+		if (is_function(/*backgroundClickPC*/ ctx[11])) /*backgroundClickPC*/ ctx[11].apply(this, arguments);
 	});
 
 	backgroundoverlay1 = new BackgroundOverlay({
 			props: {
 				class: "background-bp-sp ",
-				backgroundOverlay: /*backgroundOverlaySP*/ ctx[5]
+				backgroundOverlay: /*backgroundOverlaySP*/ ctx[6]
 			}
 		});
 
 	backgroundoverlay1.$on("click", function () {
-		if (is_function(/*backgroundClickSP*/ ctx[9])) /*backgroundClickSP*/ ctx[9].apply(this, arguments);
+		if (is_function(/*backgroundClickSP*/ ctx[10])) /*backgroundClickSP*/ ctx[10].apply(this, arguments);
 	});
 
 	return {
@@ -16562,10 +16562,10 @@ function create_if_block_2(ctx) {
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 			const backgroundoverlay0_changes = {};
-			if (dirty & /*backgroundOverlayPC*/ 16) backgroundoverlay0_changes.backgroundOverlay = /*backgroundOverlayPC*/ ctx[4];
+			if (dirty & /*backgroundOverlayPC*/ 32) backgroundoverlay0_changes.backgroundOverlay = /*backgroundOverlayPC*/ ctx[5];
 			backgroundoverlay0.$set(backgroundoverlay0_changes);
 			const backgroundoverlay1_changes = {};
-			if (dirty & /*backgroundOverlaySP*/ 32) backgroundoverlay1_changes.backgroundOverlay = /*backgroundOverlaySP*/ ctx[5];
+			if (dirty & /*backgroundOverlaySP*/ 64) backgroundoverlay1_changes.backgroundOverlay = /*backgroundOverlaySP*/ ctx[6];
 			backgroundoverlay1.$set(backgroundoverlay1_changes);
 		},
 		i(local) {
@@ -16587,7 +16587,7 @@ function create_if_block_2(ctx) {
 	};
 }
 
-// (206:0) {#if isPreview()}
+// (207:0) {#if isPreview()}
 function create_if_block_1(ctx) {
 	return {
 		c: noop,
@@ -16599,14 +16599,14 @@ function create_if_block_1(ctx) {
 	};
 }
 
-// (222:0) {#if visible}
+// (223:0) {#if visible}
 function create_if_block(ctx) {
 	let div;
 	let div_class_value;
 	let div_intro;
 	let current;
-	const default_slot_template = /*#slots*/ ctx[23].default;
-	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[22], null);
+	const default_slot_template = /*#slots*/ ctx[24].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[23], null);
 
 	return {
 		c() {
@@ -16615,7 +16615,8 @@ function create_if_block(ctx) {
 			attr(div, "class", div_class_value = "" + (null_to_empty(['modal', /*useBreakPoint*/ ctx[0] ? 'modal-bp' : ''].join(' ')) + " svelte-45ue06"));
 			attr(div, "role", "dialog");
 			attr(div, "aria-modal", "true");
-			attr(div, "style", Array.from(/*modalStyles*/ ctx[12]).join(';'));
+			attr(div, "data-layer-id", /*layerId*/ ctx[2]);
+			attr(div, "style", Array.from(/*modalStyles*/ ctx[13]).join(';'));
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -16624,22 +16625,22 @@ function create_if_block(ctx) {
 				default_slot.m(div, null);
 			}
 
-			/*div_binding*/ ctx[24](div);
+			/*div_binding*/ ctx[25](div);
 			current = true;
 		},
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 
 			if (default_slot) {
-				if (default_slot.p && (!current || dirty & /*$$scope*/ 4194304)) {
+				if (default_slot.p && (!current || dirty & /*$$scope*/ 8388608)) {
 					update_slot_base(
 						default_slot,
 						default_slot_template,
 						ctx,
-						/*$$scope*/ ctx[22],
+						/*$$scope*/ ctx[23],
 						!current
-						? get_all_dirty_from_scope(/*$$scope*/ ctx[22])
-						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[22], dirty, null),
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[23])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[23], dirty, null),
 						null
 					);
 				}
@@ -16648,6 +16649,10 @@ function create_if_block(ctx) {
 			if (!current || dirty & /*useBreakPoint*/ 1 && div_class_value !== (div_class_value = "" + (null_to_empty(['modal', /*useBreakPoint*/ ctx[0] ? 'modal-bp' : ''].join(' ')) + " svelte-45ue06"))) {
 				attr(div, "class", div_class_value);
 			}
+
+			if (!current || dirty & /*layerId*/ 4) {
+				attr(div, "data-layer-id", /*layerId*/ ctx[2]);
+			}
 		},
 		i(local) {
 			if (current) return;
@@ -16656,7 +16661,7 @@ function create_if_block(ctx) {
 			if (!div_intro) {
 				add_render_callback(() => {
 					div_intro = create_in_transition(div, customAnimation, {
-						transforms: /*transforms*/ ctx[2],
+						transforms: /*transforms*/ ctx[3],
 						animationStyle: /*animation*/ ctx[1]
 					});
 
@@ -16673,7 +16678,7 @@ function create_if_block(ctx) {
 		d(detaching) {
 			if (detaching) detach(div);
 			if (default_slot) default_slot.d(detaching);
-			/*div_binding*/ ctx[24](null);
+			/*div_binding*/ ctx[25](null);
 		}
 	};
 }
@@ -16699,7 +16704,7 @@ function create_fragment$1(ctx) {
 
 	current_block_type_index = select_block_type(ctx);
 	if_block0 = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
-	let if_block1 = /*visible*/ ctx[7] && create_if_block(ctx);
+	let if_block1 = /*visible*/ ctx[8] && create_if_block(ctx);
 
 	return {
 		c() {
@@ -16717,7 +16722,7 @@ function create_fragment$1(ctx) {
 
 			if (!mounted) {
 				dispose = listen(window, "keydown", function () {
-					if (is_function(/*handle_keydown*/ ctx[8])) /*handle_keydown*/ ctx[8].apply(this, arguments);
+					if (is_function(/*handle_keydown*/ ctx[9])) /*handle_keydown*/ ctx[9].apply(this, arguments);
 				});
 
 				mounted = true;
@@ -16751,11 +16756,11 @@ function create_fragment$1(ctx) {
 				if_block0.m(t.parentNode, t);
 			}
 
-			if (/*visible*/ ctx[7]) {
+			if (/*visible*/ ctx[8]) {
 				if (if_block1) {
 					if_block1.p(ctx, dirty);
 
-					if (dirty & /*visible*/ 128) {
+					if (dirty & /*visible*/ 256) {
 						transition_in(if_block1, 1);
 					}
 				} else {
@@ -16811,6 +16816,7 @@ function instance$1($$self, $$props, $$invalidate) {
 	let { animation = 'none' } = $$props;
 	let { closeEventName = '' } = $$props;
 	let { closeEventValue = null } = $$props;
+	let { layerId = '' } = $$props;
 
 	// モーダル背景の設定
 	const isExistBackgroundOverlayValue = placement && placement.backgroundOverlay !== undefined;
@@ -16829,7 +16835,7 @@ function instance$1($$self, $$props, $$invalidate) {
 	let modal;
 
 	onMount$1(() => {
-		$$invalidate(7, visible = true);
+		$$invalidate(8, visible = true);
 	});
 
 	onDestroy$1(() => setPreviousFocus());
@@ -16837,24 +16843,25 @@ function instance$1($$self, $$props, $$invalidate) {
 	function div_binding($$value) {
 		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
 			modal = $$value;
-			$$invalidate(6, modal);
+			$$invalidate(7, modal);
 		});
 	}
 
 	$$self.$$set = $$props => {
 		if ('useBreakPoint' in $$props) $$invalidate(0, useBreakPoint = $$props.useBreakPoint);
-		if ('placement' in $$props) $$invalidate(13, placement = $$props.placement);
-		if ('breakPoint' in $$props) $$invalidate(14, breakPoint = $$props.breakPoint);
-		if ('elasticity' in $$props) $$invalidate(15, elasticity = $$props.elasticity);
+		if ('placement' in $$props) $$invalidate(14, placement = $$props.placement);
+		if ('breakPoint' in $$props) $$invalidate(15, breakPoint = $$props.breakPoint);
+		if ('elasticity' in $$props) $$invalidate(16, elasticity = $$props.elasticity);
 		if ('animation' in $$props) $$invalidate(1, animation = $$props.animation);
-		if ('closeEventName' in $$props) $$invalidate(16, closeEventName = $$props.closeEventName);
-		if ('closeEventValue' in $$props) $$invalidate(17, closeEventValue = $$props.closeEventValue);
-		if ('$$scope' in $$props) $$invalidate(22, $$scope = $$props.$$scope);
+		if ('closeEventName' in $$props) $$invalidate(17, closeEventName = $$props.closeEventName);
+		if ('closeEventValue' in $$props) $$invalidate(18, closeEventValue = $$props.closeEventValue);
+		if ('layerId' in $$props) $$invalidate(2, layerId = $$props.layerId);
+		if ('$$scope' in $$props) $$invalidate(23, $$scope = $$props.$$scope);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue*/ 196608) {
-			$$invalidate(21, close = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue*/ 393216) {
+			$$invalidate(22, close = () => {
 				const onClose = { operation: 'closeApp', args: ['button'] };
 
 				if (closeEventName) {
@@ -16865,45 +16872,45 @@ function instance$1($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 24577) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 49153) {
 			{
 				if (isExistBackgroundOverlayValue) {
-					$$invalidate(3, backgroundOverlay = placement.backgroundOverlay);
+					$$invalidate(4, backgroundOverlay = placement.backgroundOverlay);
 				}
 
 				if (useBreakPoint) {
 					const pc = breakPoint?.PC?.placement?.backgroundOverlay;
-					$$invalidate(4, backgroundOverlayPC = pc ?? false);
+					$$invalidate(5, backgroundOverlayPC = pc ?? false);
 					const sp = breakPoint?.SP?.placement?.backgroundOverlay;
-					$$invalidate(5, backgroundOverlaySP = sp ?? false);
+					$$invalidate(6, backgroundOverlaySP = sp ?? false);
 				}
 			}
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 24577) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 49153) {
 			{
 				if (placement && placement.backgroundClick) {
-					$$invalidate(18, backgroundClickFunction = placement.backgroundClick);
+					$$invalidate(19, backgroundClickFunction = placement.backgroundClick);
 				}
 
 				if (useBreakPoint) {
 					const pc = breakPoint?.PC?.placement?.backgroundClick;
 
 					if (pc) {
-						$$invalidate(19, backgroundClickFunctionPC = pc);
+						$$invalidate(20, backgroundClickFunctionPC = pc);
 					}
 
 					const sp = breakPoint?.SP?.placement?.backgroundClick;
 
 					if (sp) {
-						$$invalidate(20, backgroundClickFunctionSP = sp);
+						$$invalidate(21, backgroundClickFunctionSP = sp);
 					}
 				}
 			}
 		}
 
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunction*/ 458752) {
-			$$invalidate(11, backgroundClick = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunction*/ 917504) {
+			$$invalidate(12, backgroundClick = () => {
 				if (closeEventName) {
 					send_event(closeEventName, closeEventValue);
 				}
@@ -16912,8 +16919,8 @@ function instance$1($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionPC*/ 720896) {
-			$$invalidate(10, backgroundClickPC = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionPC*/ 1441792) {
+			$$invalidate(11, backgroundClickPC = () => {
 				if (closeEventName) {
 					send_event(closeEventName, closeEventValue);
 				}
@@ -16922,8 +16929,8 @@ function instance$1($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionSP*/ 1245184) {
-			$$invalidate(9, backgroundClickSP = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionSP*/ 2490368) {
+			$$invalidate(10, backgroundClickSP = () => {
 				if (closeEventName) {
 					send_event(closeEventName, closeEventValue);
 				}
@@ -16932,7 +16939,7 @@ function instance$1($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint, transforms*/ 24581) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint, transforms*/ 49161) {
 			// 表示位置のスタイルとアニメーションの動きを設定
 			{
 				// 表示位置のスタイルの設定
@@ -16948,7 +16955,7 @@ function instance$1($$self, $$props, $$invalidate) {
 					modalStyles.add(positionStyle);
 				}
 
-				$$invalidate(2, transforms = []);
+				$$invalidate(3, transforms = []);
 
 				DEVICE_IDS.forEach(deviceId => {
 					if (useBreakPoint) {
@@ -16976,7 +16983,7 @@ function instance$1($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 24577) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 49153) {
 			// 表示位置の調整のスタイルを設定
 			{
 				let margin = DefaultModalPlacement.margin;
@@ -17008,7 +17015,7 @@ function instance$1($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*elasticity, useBreakPoint, breakPoint*/ 49153) {
+		if ($$self.$$.dirty & /*elasticity, useBreakPoint, breakPoint*/ 98305) {
 			// 拡大方法のスタイルを設定
 			{
 				let elasticStyle = ElasticityStyle[elasticity];
@@ -17034,19 +17041,20 @@ function instance$1($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*close*/ 2097152) {
-			$$invalidate(8, handle_keydown = handleKeydown({ Escape: close }));
+		if ($$self.$$.dirty & /*close*/ 4194304) {
+			$$invalidate(9, handle_keydown = handleKeydown({ Escape: close }));
 		}
 	};
 
-	$$invalidate(6, modal = null);
+	$$invalidate(7, modal = null);
 
 	// svelteコンポーネントのアニメーションを発火させるためにマウント時にvisibleをtrueにする。
-	$$invalidate(7, visible = false);
+	$$invalidate(8, visible = false);
 
 	return [
 		useBreakPoint,
 		animation,
+		layerId,
 		transforms,
 		backgroundOverlay,
 		backgroundOverlayPC,
@@ -17085,12 +17093,13 @@ class Modal extends SvelteComponent {
 			safe_not_equal,
 			{
 				useBreakPoint: 0,
-				placement: 13,
-				breakPoint: 14,
-				elasticity: 15,
+				placement: 14,
+				breakPoint: 15,
+				elasticity: 16,
 				animation: 1,
-				closeEventName: 16,
-				closeEventValue: 17
+				closeEventName: 17,
+				closeEventValue: 18,
+				layerId: 2
 			},
 			add_css$1
 		);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plaidev/karte-action-sdk",
-  "version": "1.1.255-28810509.aa4fd817",
+  "version": "1.1.255-28830850.ad94289f",
   "author": "Plaid Inc.",
   "license": "Apache-2.0",
   "module": "./dist/index.es.js",
@@ -65,13 +65,13 @@
     "@rollup/plugin-node-resolve": "^15.0.0",
     "@rollup/plugin-replace": "^5.0.0",
     "@sveltejs/vite-plugin-svelte": "1.0.0-next.37",
-    "@testing-library/svelte": "^3.1.3",
+    "@testing-library/svelte": "^5.2.4",
     "@tsconfig/svelte": "^2.0.1",
     "@types/brotli": "^1.3.1",
     "@types/serve-static": "^1.13.10",
     "brotli": "^1.3.3",
     "c8": "^7.12.0",
-    "happy-dom": "^6.0.3",
+    "jsdom": "24.1.0",
     "isomorphic-fetch": "3.0.0",
     "listhen": "^0.2.13",
     "node-fetch": "2.6.7",
@@ -95,7 +95,7 @@
     "textlint-rule-preset-ja-spacing": "^2.3.0",
     "textlint-rule-preset-ja-technical-writing": "^7.0.0",
     "tslib": "^2.3.1",
-    "tsx": "^3.12.3",
+    "tsx": "^4.19.1",
     "typescript": "^4.7.4",
     "vitepress": "1.0.0-alpha.30",
     "vitest": "latest",