@plaidev/karte-action-sdk 1.1.264-29046374.a006e69f → 1.1.264-29051600.c90abff9

package/dist/index.es.d.ts

@@ -2460,6 +2460,9 @@ type CustomizeCssProps = {
 type BrandStyleProps = {
     customBrandKit?: Partial<BrandKit>;
 };
+type ActionTableProps = {
+    actionTableKey?: string;
+};
 type CommonProps = MetaProps & PositionProps & CustomizeCssProps & BrandStyleProps;
 type ClickableProps = {
     onClick?: OnClickOperation;
@@ -2797,7 +2800,10 @@ type TextLinkProps = CommonProps & ClickableProps & LinkProps & FontFamilyProps
 };
 declare const TEXT_LINK_SIZE_STYLES: PropStyles<TextLinkProps, "size">;
 declare const getTextLinkThemeStyles: (customBrandKit?: Partial<BrandKit>) => BrandableStyles<TextLinkProps>;
-type ListProps = CommonProps & {
+type FrameModalProps = CommonProps & OverflowProps & BorderProps & RadiusProps & ShadowProps & BackgroundColorProps & BackgroundImageProps & {
+    width?: Properties["width"];
+};
+type ListProps = CommonProps & ActionTableProps & {
     gap?: Properties["gap"];
     borderWidth?: Properties["borderTopWidth"];
     borderStyle?: Properties["borderTopStyle"];
@@ -2893,7 +2899,7 @@ type CodeProps = CommonProps & {
     rawScript?: string;
 };
 declare const ROUND_STYLES: Record<keyof typeof ROUND_VARIANT, Pick<Properties, "borderTopLeftRadius" | "borderTopRightRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius">>;
-export { ACTION_HOOK_LABEL, KARTE_MODAL_ROOT, create, destroyAction, onCreate, onDestroy, showModal, destroy, initialize, finalize, loadGlobalScript, loadGlobalStyle, applyGlobalCss, getState, setState, getStates, isOpened, getVariables, setVariables, resetVariables, getEventHandlers, setEventHandlers, resetEventHandlers, getSystem, setSetting, eventHandlers, variables, formData, state, onScroll, onTime, getLogs, getEvents, logger, listenLogger, hideOnScroll, hideOnTime, showOnScroll, showOnTime, PropTypes, PropType, Code, MediaQueries, MediaQuery, Directions, Direction, AnimationStyles, AnimationStyle, ModalPositions, ModalPosition, ModalMargin, ModalPlacement, DefaultModalPlacement, Elasticities, Elasticity, ElasticityStyle, DefaultElasticity, TextDirections, TextDirection, OperationArgumentType, Operation, OnClickOperationOptions, OnClickOperation, LongText, Url, RegExpProp, Image, LengthUnits, LengthUnit, Length, Color, FontWeight, SYSTEM_FONT, Fonts, Font, Justifies, Justify, Alignments, Alignment, FlexDirections, FlexDirection, ObjectFits, ObjectFit, ClipPaths, ClipPath, Repeats, Repeat, BackgroundSizes, BackgroundSize, Cursors, Cursor, Overflows, Overflow, Border, BorderStyle, BorderWidth, BoxShadow, Style, TransitState, WritingModes, WritingMode, DateTime, Icon, ListSeparatorTypes, EdgePosition, DefaultEdgePosition, ListSeparatorNone, ListSeparatorBorder, ListSeparatorGap, ListSeparator, DefaultListSeparatorNone, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparator, ListBackgroundTypes, ListBackgroundNone, ListBackgroundStripe, ListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListBackground, ListDirections, ListDirection, ListContext, SlideButtonIcon, SlideButtonText, SlideButton, DefaultSlideButton, SlideButtonPosition, SlideNavigationButton, DefaultSlideNavigationButton, FormInputName, FormButtonColor, DefaultFormButtonColor, ModalStyle, ModalBreakPoint, DefaultModalBreakPoint, FormIdentifyTextFields, FormIdentifyTextField, FormIdentifyTextFieldValidations, FormIdentifyTextFieldPlaceholders, DefaultFormIdentifyTextField, FormIdentifyBooleanFields, FormIdentifyBooleanField, DefaultFormIdentifyBooleanField, showAction, closeAction, loadStyle, applyCss, onShow, onClose, onChangeState, getActionRoot, getCssVariables, show, close, ensureModalRoot, createApp, createFog, collection, loadActionTableRow, loadActionTableRows, loadActionTableQuery, loadActionTable, addChoiceAnswer, addFreeAnswer, removeAnswer, getAnsweredQuestion, getAnsweredQuestionIds, sendAnswer, sendAnswers, widget, onMount, onDestory, beforeUpdate, afterUpdate, tick, LAYOUT_COMPONENT_NAMES, PropStyles, ROUND_VARIANT, PositionProps, MetaProps, CustomizeCssProps, BrandStyleProps, CommonProps, ClickableProps, OverflowProps, BorderProps, PaddingProps, RadiusProps, BackgroundColorProps, BackgroundImageProps, ShadowProps, WithIconProps, LinkProps, AspectProps, FontFamilyProps, AVATAR_SIZE, AVATAR_SHAPE, AvatarProps, avatarPropsDefault, AVATAR_SIZE_STYLES, BUTTON_SIZE, BUTTON_THEME, BUTTON_VARIANT, BUTTON_ROUND, BUTTON_LINK_TARGET, BUTTON_ICON_ANGLE, ButtonProps, buttonPropsDefault, getButtonThemeStyles, BUTTON_SIZE_STYLES, BUTTON_ROUND_STYLES, BUTTON_WRAP_STYLES, ButtonOutlinedProps, buttonOutlinedPropsDefault, BUTTON_OUTLINED_SIZE_STYLES, getButtonOutlinedThemeStyles, BUTTON_OUTLINED_ROUND_STYLES, BUTTON_OUTLINED_WRAP_STYLES, BUTTON_TEXT_SIZE, BUTTON_TEXT_THEME, ButtonTextProps, BUTTON_TEXT_SIZE_STYLES, getButtonTextThemeStyles, CLOSE_BUTTON_PLACEMENT, CLOSE_BUTTON_ROUND, CLOSE_BUTTON_LABEL_PLACEMENT, CloseButtonProps, ICON_SIZE, ICON_VARIANTS, IconProps, ICON_SIZE_STYLES, IMAGE_ROUND_SHAPE, IMAGE_ASPECT_VARIANTS, ImageProps, LAYOUT_DISPLAY_TYPE, LayoutDisplayType, LAYOUT_DIRECTION, LayoutFlexDirection, LAYOUT_ALIGN, LayoutFlexAlign, LAYOUT_JUSTIFY, LayoutFlexJustify, LayerLayoutProps, SliderProps, SliderItemProps, LAYER_TEXT_SIZE, TEXT_THEME, TEXT_STYLE, LayerTextProps, getTextThemeStyles, TEXT_VARIANTS, TEXT_LINK_SIZE, TEXT_LINK_THEME, TEXT_LINK_UNDERLINE, TextLinkProps, TEXT_LINK_SIZE_STYLES, getTextLinkThemeStyles, ListProps, ListItemProps, LIST_ITEM_CONTEXT_KEY, ListItemContext, MultiColumnProps, MultiColumnItemProps, MULTI_COLUMN_ITEM_CONTEXT_KEY, MultiColumnItemContext, YoutubeProps, CountDownProps, CountDownValueType, CountDownValueProps, CountDownValues, ClipboardProps, CodeProps, BrandKit, getBrandKit, useBrandKit, ROUND_STYLES, VariantStyles, VariantDefinition, VariantDefinitionGroup, ASPECT_VARIANT, AspectVariantCode, ASPECT_VARIANTS, FontVariantMeta, FONT_FAMILY_VARIANT, FontFamilyVariantCode, FONT_FAMILY_VARIANTS, FONT_FAMILY_VARIANT_GROUPS, SHADOW_VARIANT, ShadowVariantCode, SHADOW_VARIANTS };
+export { ACTION_HOOK_LABEL, KARTE_MODAL_ROOT, create, destroyAction, onCreate, onDestroy, showModal, destroy, initialize, finalize, loadGlobalScript, loadGlobalStyle, applyGlobalCss, getState, setState, getStates, isOpened, getVariables, setVariables, resetVariables, getEventHandlers, setEventHandlers, resetEventHandlers, getSystem, setSetting, eventHandlers, variables, formData, state, onScroll, onTime, getLogs, getEvents, logger, listenLogger, hideOnScroll, hideOnTime, showOnScroll, showOnTime, PropTypes, PropType, Code, MediaQueries, MediaQuery, Directions, Direction, AnimationStyles, AnimationStyle, ModalPositions, ModalPosition, ModalMargin, ModalPlacement, DefaultModalPlacement, Elasticities, Elasticity, ElasticityStyle, DefaultElasticity, TextDirections, TextDirection, OperationArgumentType, Operation, OnClickOperationOptions, OnClickOperation, LongText, Url, RegExpProp, Image, LengthUnits, LengthUnit, Length, Color, FontWeight, SYSTEM_FONT, Fonts, Font, Justifies, Justify, Alignments, Alignment, FlexDirections, FlexDirection, ObjectFits, ObjectFit, ClipPaths, ClipPath, Repeats, Repeat, BackgroundSizes, BackgroundSize, Cursors, Cursor, Overflows, Overflow, Border, BorderStyle, BorderWidth, BoxShadow, Style, TransitState, WritingModes, WritingMode, DateTime, Icon, ListSeparatorTypes, EdgePosition, DefaultEdgePosition, ListSeparatorNone, ListSeparatorBorder, ListSeparatorGap, ListSeparator, DefaultListSeparatorNone, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparator, ListBackgroundTypes, ListBackgroundNone, ListBackgroundStripe, ListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListBackground, ListDirections, ListDirection, ListContext, SlideButtonIcon, SlideButtonText, SlideButton, DefaultSlideButton, SlideButtonPosition, SlideNavigationButton, DefaultSlideNavigationButton, FormInputName, FormButtonColor, DefaultFormButtonColor, ModalStyle, ModalBreakPoint, DefaultModalBreakPoint, FormIdentifyTextFields, FormIdentifyTextField, FormIdentifyTextFieldValidations, FormIdentifyTextFieldPlaceholders, DefaultFormIdentifyTextField, FormIdentifyBooleanFields, FormIdentifyBooleanField, DefaultFormIdentifyBooleanField, showAction, closeAction, loadStyle, applyCss, onShow, onClose, onChangeState, getActionRoot, getCssVariables, show, close, ensureModalRoot, createApp, createFog, collection, loadActionTableRow, loadActionTableRows, loadActionTableQuery, loadActionTable, addChoiceAnswer, addFreeAnswer, removeAnswer, getAnsweredQuestion, getAnsweredQuestionIds, sendAnswer, sendAnswers, widget, onMount, onDestory, beforeUpdate, afterUpdate, tick, LAYOUT_COMPONENT_NAMES, PropStyles, ROUND_VARIANT, PositionProps, MetaProps, CustomizeCssProps, BrandStyleProps, ActionTableProps, CommonProps, ClickableProps, OverflowProps, BorderProps, PaddingProps, RadiusProps, BackgroundColorProps, BackgroundImageProps, ShadowProps, WithIconProps, LinkProps, AspectProps, FontFamilyProps, AVATAR_SIZE, AVATAR_SHAPE, AvatarProps, avatarPropsDefault, AVATAR_SIZE_STYLES, BUTTON_SIZE, BUTTON_THEME, BUTTON_VARIANT, BUTTON_ROUND, BUTTON_LINK_TARGET, BUTTON_ICON_ANGLE, ButtonProps, buttonPropsDefault, getButtonThemeStyles, BUTTON_SIZE_STYLES, BUTTON_ROUND_STYLES, BUTTON_WRAP_STYLES, ButtonOutlinedProps, buttonOutlinedPropsDefault, BUTTON_OUTLINED_SIZE_STYLES, getButtonOutlinedThemeStyles, BUTTON_OUTLINED_ROUND_STYLES, BUTTON_OUTLINED_WRAP_STYLES, BUTTON_TEXT_SIZE, BUTTON_TEXT_THEME, ButtonTextProps, BUTTON_TEXT_SIZE_STYLES, getButtonTextThemeStyles, CLOSE_BUTTON_PLACEMENT, CLOSE_BUTTON_ROUND, CLOSE_BUTTON_LABEL_PLACEMENT, CloseButtonProps, ICON_SIZE, ICON_VARIANTS, IconProps, ICON_SIZE_STYLES, IMAGE_ROUND_SHAPE, IMAGE_ASPECT_VARIANTS, ImageProps, LAYOUT_DISPLAY_TYPE, LayoutDisplayType, LAYOUT_DIRECTION, LayoutFlexDirection, LAYOUT_ALIGN, LayoutFlexAlign, LAYOUT_JUSTIFY, LayoutFlexJustify, LayerLayoutProps, SliderProps, SliderItemProps, LAYER_TEXT_SIZE, TEXT_THEME, TEXT_STYLE, LayerTextProps, getTextThemeStyles, TEXT_VARIANTS, TEXT_LINK_SIZE, TEXT_LINK_THEME, TEXT_LINK_UNDERLINE, TextLinkProps, TEXT_LINK_SIZE_STYLES, getTextLinkThemeStyles, FrameModalProps, ListProps, ListItemProps, LIST_ITEM_CONTEXT_KEY, ListItemContext, MultiColumnProps, MultiColumnItemProps, MULTI_COLUMN_ITEM_CONTEXT_KEY, MultiColumnItemContext, YoutubeProps, CountDownProps, CountDownValueType, CountDownValueProps, CountDownValues, ClipboardProps, CodeProps, BrandKit, getBrandKit, useBrandKit, ROUND_STYLES, VariantStyles, VariantDefinition, VariantDefinitionGroup, ASPECT_VARIANT, AspectVariantCode, ASPECT_VARIANTS, FontVariantMeta, FONT_FAMILY_VARIANT, FontFamilyVariantCode, FONT_FAMILY_VARIANTS, FONT_FAMILY_VARIANT_GROUPS, SHADOW_VARIANT, ShadowVariantCode, SHADOW_VARIANTS };
 export type { SystemConfig, ActionVariables, ActionEventHandler, ActionProps, ActionOptions, ActionHook, ActionHookLog, ActionChangeStateHook, SendFunction, PublishFunction, OnScrollContext, OnScrollFunction, ScrollDirection, LogLevel, Log, Event, ActionCloseHook, ShowTrigger, CloseTrigger, CollectionConfig, ActionTableRowRequestConfig, ActionTableRowsRequestConfig, ActionTableQueryRequestConfig, ActionTableRequestConfig };
 export { default as State } from './components/State.svelte';
 export { default as StateItem } from './components/StateItem.svelte';

package/dist/index.es.js

@@ -15823,7 +15823,7 @@ function get_each_context$1(ctx, list, i) {
 	return child_ctx;
 }
 
-// (175:4) {#each indicators ?? [] as indicator, i}
+// (174:4) {#each indicators ?? [] as indicator, i}
 function create_each_block$1(ctx) {
 	let button;
 	let i_1;
@@ -16093,8 +16093,6 @@ function instance$j($$self, $$props, $$invalidate) {
 	};
 
 	const handleClick = e => {
-		console.log('handleClick', isDragging);
-
 		if (isDragging) {
 			e.preventDefault();
 			e.stopPropagation();
@@ -16119,6 +16117,7 @@ function instance$j($$self, $$props, $$invalidate) {
 		$$invalidate(13, movedX = null);
 		document.removeEventListener('touchmove', handleTouchmove);
 		document.removeEventListener('touchend', handleTouchend);
+		document.removeEventListener('click', handleClick);
 	};
 
 	const handleTouchstart = e => {
@@ -16138,8 +16137,6 @@ function instance$j($$self, $$props, $$invalidate) {
 	};
 
 	const handleMouseup = e => {
-		console.log('handleMouseup');
-
 		if (movedX >= 32) {
 			toNext();
 		} else if (movedX <= -32) {
@@ -17267,7 +17264,7 @@ function add_css$9(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}}");
 }
 
-// (225:0) {:else}
+// (237:0) {:else}
 function create_else_block(ctx) {
 	let backgroundoverlay;
 	let current;
@@ -17279,7 +17276,7 @@ function create_else_block(ctx) {
 		});
 
 	backgroundoverlay.$on("click", function () {
-		if (is_function(/*backgroundClick*/ ctx[12])) /*backgroundClick*/ ctx[12].apply(this, arguments);
+		if (is_function(/*backgroundClick*/ ctx[13])) /*backgroundClick*/ ctx[13].apply(this, arguments);
 	});
 
 	return {
@@ -17311,7 +17308,7 @@ function create_else_block(ctx) {
 	};
 }
 
-// (214:24) 
+// (226:24) 
 function create_if_block_2(ctx) {
 	let backgroundoverlay0;
 	let t;
@@ -17326,7 +17323,7 @@ function create_if_block_2(ctx) {
 		});
 
 	backgroundoverlay0.$on("click", function () {
-		if (is_function(/*backgroundClickPC*/ ctx[11])) /*backgroundClickPC*/ ctx[11].apply(this, arguments);
+		if (is_function(/*backgroundClickPC*/ ctx[12])) /*backgroundClickPC*/ ctx[12].apply(this, arguments);
 	});
 
 	backgroundoverlay1 = new BackgroundOverlay({
@@ -17337,7 +17334,7 @@ function create_if_block_2(ctx) {
 		});
 
 	backgroundoverlay1.$on("click", function () {
-		if (is_function(/*backgroundClickSP*/ ctx[10])) /*backgroundClickSP*/ ctx[10].apply(this, arguments);
+		if (is_function(/*backgroundClickSP*/ ctx[11])) /*backgroundClickSP*/ ctx[11].apply(this, arguments);
 	});
 
 	return {
@@ -17380,7 +17377,7 @@ function create_if_block_2(ctx) {
 	};
 }
 
-// (212:0) {#if isPreview()}
+// (224:0) {#if isPreview()}
 function create_if_block_1$1(ctx) {
 	return {
 		c: noop,
@@ -17392,14 +17389,15 @@ function create_if_block_1$1(ctx) {
 	};
 }
 
-// (228:0) {#if visible}
+// (240:0) {#if visible}
 function create_if_block$3(ctx) {
 	let div;
 	let div_class_value;
+	let div_style_value;
 	let div_intro;
 	let current;
-	const default_slot_template = /*#slots*/ ctx[24].default;
-	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[23], null);
+	const default_slot_template = /*#slots*/ ctx[26].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[25], null);
 
 	return {
 		c() {
@@ -17409,7 +17407,7 @@ function create_if_block$3(ctx) {
 			attr(div, "role", "dialog");
 			attr(div, "aria-modal", "true");
 			attr(div, "data-layer-id", /*layerId*/ ctx[2]);
-			attr(div, "style", Array.from(/*modalStyles*/ ctx[13]).join(';'));
+			attr(div, "style", div_style_value = [Array.from(/*modalStyles*/ ctx[14]).join(';'), /*style*/ ctx[9]].join(' '));
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -17418,22 +17416,22 @@ function create_if_block$3(ctx) {
 				default_slot.m(div, null);
 			}
 
-			/*div_binding*/ ctx[25](div);
+			/*div_binding*/ ctx[27](div);
 			current = true;
 		},
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 
 			if (default_slot) {
-				if (default_slot.p && (!current || dirty & /*$$scope*/ 8388608)) {
+				if (default_slot.p && (!current || dirty & /*$$scope*/ 33554432)) {
 					update_slot_base(
 						default_slot,
 						default_slot_template,
 						ctx,
-						/*$$scope*/ ctx[23],
+						/*$$scope*/ ctx[25],
 						!current
-						? get_all_dirty_from_scope(/*$$scope*/ ctx[23])
-						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[23], dirty, null),
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[25])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[25], dirty, null),
 						null
 					);
 				}
@@ -17446,6 +17444,10 @@ function create_if_block$3(ctx) {
 			if (!current || dirty & /*layerId*/ 4) {
 				attr(div, "data-layer-id", /*layerId*/ ctx[2]);
 			}
+
+			if (!current || dirty & /*style*/ 512 && div_style_value !== (div_style_value = [Array.from(/*modalStyles*/ ctx[14]).join(';'), /*style*/ ctx[9]].join(' '))) {
+				attr(div, "style", div_style_value);
+			}
 		},
 		i(local) {
 			if (current) return;
@@ -17471,7 +17473,7 @@ function create_if_block$3(ctx) {
 		d(detaching) {
 			if (detaching) detach(div);
 			if (default_slot) default_slot.d(detaching);
-			/*div_binding*/ ctx[25](null);
+			/*div_binding*/ ctx[27](null);
 		}
 	};
 }
@@ -17515,7 +17517,7 @@ function create_fragment$d(ctx) {
 
 			if (!mounted) {
 				dispose = listen(window, "keydown", function () {
-					if (is_function(/*handle_keydown*/ ctx[9])) /*handle_keydown*/ ctx[9].apply(this, arguments);
+					if (is_function(/*handle_keydown*/ ctx[10])) /*handle_keydown*/ ctx[10].apply(this, arguments);
 				});
 
 				mounted = true;
@@ -17601,12 +17603,14 @@ function instance$d($$self, $$props, $$invalidate) {
 	let backgroundClickSP;
 	let handle_keydown;
 	let visible;
+	let style;
 	let { $$slots: slots = {}, $$scope } = $$props;
 	let { useBreakPoint = false } = $$props;
 	let { placement } = $$props;
 	let { breakPoint } = $$props;
 	let { elasticity } = $$props;
 	let { animation = 'none' } = $$props;
+	let { props = {} } = $$props;
 	let { closeEventName = '' } = $$props;
 	let { closeEventValue = null } = $$props;
 	let { layerId = '' } = $$props;
@@ -17643,19 +17647,20 @@ function instance$d($$self, $$props, $$invalidate) {
 
 	$$self.$$set = $$props => {
 		if ('useBreakPoint' in $$props) $$invalidate(0, useBreakPoint = $$props.useBreakPoint);
-		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 ('placement' in $$props) $$invalidate(15, placement = $$props.placement);
+		if ('breakPoint' in $$props) $$invalidate(16, breakPoint = $$props.breakPoint);
+		if ('elasticity' in $$props) $$invalidate(17, elasticity = $$props.elasticity);
 		if ('animation' in $$props) $$invalidate(1, animation = $$props.animation);
-		if ('closeEventName' in $$props) $$invalidate(17, closeEventName = $$props.closeEventName);
-		if ('closeEventValue' in $$props) $$invalidate(18, closeEventValue = $$props.closeEventValue);
+		if ('props' in $$props) $$invalidate(18, props = $$props.props);
+		if ('closeEventName' in $$props) $$invalidate(19, closeEventName = $$props.closeEventName);
+		if ('closeEventValue' in $$props) $$invalidate(20, closeEventValue = $$props.closeEventValue);
 		if ('layerId' in $$props) $$invalidate(2, layerId = $$props.layerId);
-		if ('$$scope' in $$props) $$invalidate(23, $$scope = $$props.$$scope);
+		if ('$$scope' in $$props) $$invalidate(25, $$scope = $$props.$$scope);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue*/ 393216) {
-			$$invalidate(22, close = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue*/ 1572864) {
+			$$invalidate(24, close = () => {
 				const onClose = { operation: 'closeApp', args: ['button'] };
 
 				if (closeEventName) {
@@ -17666,7 +17671,7 @@ function instance$d($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 49153) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 98305) {
 			{
 				if (isExistBackgroundOverlayValue) {
 					$$invalidate(4, backgroundOverlay = placement.backgroundOverlay);
@@ -17681,30 +17686,30 @@ function instance$d($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 49153) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 98305) {
 			{
 				if (placement && placement.backgroundClick) {
-					$$invalidate(19, backgroundClickFunction = placement.backgroundClick);
+					$$invalidate(21, backgroundClickFunction = placement.backgroundClick);
 				}
 
 				if (useBreakPoint) {
 					const pc = breakPoint?.PC?.placement?.backgroundClick;
 
 					if (pc) {
-						$$invalidate(20, backgroundClickFunctionPC = pc);
+						$$invalidate(22, backgroundClickFunctionPC = pc);
 					}
 
 					const sp = breakPoint?.SP?.placement?.backgroundClick;
 
 					if (sp) {
-						$$invalidate(21, backgroundClickFunctionSP = sp);
+						$$invalidate(23, backgroundClickFunctionSP = sp);
 					}
 				}
 			}
 		}
 
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunction*/ 917504) {
-			$$invalidate(12, backgroundClick = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunction*/ 3670016) {
+			$$invalidate(13, backgroundClick = () => {
 				if (closeEventName) {
 					send_event(closeEventName, closeEventValue);
 				}
@@ -17713,8 +17718,8 @@ function instance$d($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionPC*/ 1441792) {
-			$$invalidate(11, backgroundClickPC = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionPC*/ 5767168) {
+			$$invalidate(12, backgroundClickPC = () => {
 				if (closeEventName) {
 					send_event(closeEventName, closeEventValue);
 				}
@@ -17723,8 +17728,8 @@ function instance$d($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionSP*/ 2490368) {
-			$$invalidate(10, backgroundClickSP = () => {
+		if ($$self.$$.dirty & /*closeEventName, closeEventValue, backgroundClickFunctionSP*/ 9961472) {
+			$$invalidate(11, backgroundClickSP = () => {
 				if (closeEventName) {
 					send_event(closeEventName, closeEventValue);
 				}
@@ -17733,7 +17738,7 @@ function instance$d($$self, $$props, $$invalidate) {
 			});
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint, transforms*/ 49161) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint, transforms*/ 98313) {
 			// 表示位置のスタイルとアニメーションの動きを設定
 			{
 				// 表示位置のスタイルの設定
@@ -17781,7 +17786,7 @@ function instance$d($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 49153) {
+		if ($$self.$$.dirty & /*placement, useBreakPoint, breakPoint*/ 98305) {
 			// 表示位置の調整のスタイルを設定
 			{
 				let margin = DefaultModalPlacement.margin;
@@ -17813,7 +17818,7 @@ function instance$d($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*elasticity, useBreakPoint, breakPoint*/ 98305) {
+		if ($$self.$$.dirty & /*elasticity, useBreakPoint, breakPoint*/ 196609) {
 			// 拡大方法のスタイルを設定
 			{
 				let elasticStyle = ElasticityStyle[elasticity];
@@ -17839,8 +17844,20 @@ function instance$d($$self, $$props, $$invalidate) {
 			}
 		}
 
-		if ($$self.$$.dirty & /*close*/ 4194304) {
-			$$invalidate(9, handle_keydown = handleKeydown({ Escape: close }));
+		if ($$self.$$.dirty & /*close*/ 16777216) {
+			$$invalidate(10, handle_keydown = handleKeydown({ Escape: close }));
+		}
+
+		if ($$self.$$.dirty & /*props*/ 262144) {
+			$$invalidate(9, style = objToStyle({
+				width: props.width,
+				...toCssOverflow(props),
+				...toCssShadow(props),
+				...toCssRadius(props),
+				...toCssBackgroundImage(props),
+				...toCssBackgroundColor(props),
+				...toCssBorder(props)
+			}));
 		}
 	};
 
@@ -17859,6 +17876,7 @@ function instance$d($$self, $$props, $$invalidate) {
 		backgroundOverlaySP,
 		modal,
 		visible,
+		style,
 		handle_keydown,
 		backgroundClickSP,
 		backgroundClickPC,
@@ -17867,6 +17885,7 @@ function instance$d($$self, $$props, $$invalidate) {
 		placement,
 		breakPoint,
 		elasticity,
+		props,
 		closeEventName,
 		closeEventValue,
 		backgroundClickFunction,
@@ -17891,12 +17910,13 @@ class Modal extends SvelteComponent {
 			safe_not_equal,
 			{
 				useBreakPoint: 0,
-				placement: 14,
-				breakPoint: 15,
-				elasticity: 16,
+				placement: 15,
+				breakPoint: 16,
+				elasticity: 17,
 				animation: 1,
-				closeEventName: 17,
-				closeEventValue: 18,
+				props: 18,
+				closeEventName: 19,
+				closeEventValue: 20,
 				layerId: 2
 			},
 			add_css$9
@@ -18005,8 +18025,8 @@ function add_css$7(target) {
 function create_fragment$b(ctx) {
 	let ul;
 	let current;
-	const default_slot_template = /*#slots*/ ctx[5].default;
-	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[4], null);
+	const default_slot_template = /*#slots*/ ctx[6].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[5], null);
 
 	return {
 		c() {
@@ -18027,15 +18047,15 @@ function create_fragment$b(ctx) {
 		},
 		p(ctx, [dirty]) {
 			if (default_slot) {
-				if (default_slot.p && (!current || dirty & /*$$scope*/ 16)) {
+				if (default_slot.p && (!current || dirty & /*$$scope*/ 32)) {
 					update_slot_base(
 						default_slot,
 						default_slot_template,
 						ctx,
-						/*$$scope*/ ctx[4],
+						/*$$scope*/ ctx[5],
 						!current
-						? get_all_dirty_from_scope(/*$$scope*/ ctx[4])
-						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[4], dirty, null),
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[5])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[5], dirty, null),
 						null
 					);
 				}
@@ -18067,11 +18087,16 @@ function create_fragment$b(ctx) {
 
 function instance$b($$self, $$props, $$invalidate) {
 	let variables;
+	let actionTableData;
 	let style;
 	let { $$slots: slots = {}, $$scope } = $$props;
 	let { layerId } = $$props;
 	let { props } = $$props;
 	useInjectCustomizeCss(props);
+	const vars = getVariables();
+	console.log(vars);
+	console.log(props.actionTableKey);
+	console.log(vars[props.actionTableKey]);
 
 	setContext(LIST_ITEM_CONTEXT_KEY, {
 		paddingTop: props.itemPaddingTop,
@@ -18088,7 +18113,7 @@ function instance$b($$self, $$props, $$invalidate) {
 	$$self.$$set = $$props => {
 		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
 		if ('props' in $$props) $$invalidate(2, props = $$props.props);
-		if ('$$scope' in $$props) $$invalidate(4, $$scope = $$props.$$scope);
+		if ('$$scope' in $$props) $$invalidate(5, $$scope = $$props.$$scope);
 	};
 
 	$$self.$$.update = () => {
@@ -18104,6 +18129,12 @@ function instance$b($$self, $$props, $$invalidate) {
 			});
 		}
 
+		if ($$self.$$.dirty & /*props*/ 4) {
+			$$invalidate(4, actionTableData = vars[props.actionTableKey]);
+		}
+
+		if ($$self.$$.dirty & /*actionTableData*/ 16) ;
+
 		if ($$self.$$.dirty & /*props, variables*/ 12) {
 			$$invalidate(1, style = objToStyle({
 				width: props.width ?? '100%',
@@ -18112,7 +18143,7 @@ function instance$b($$self, $$props, $$invalidate) {
 		}
 	};
 
-	return [layerId, style, props, variables, $$scope, slots];
+	return [layerId, style, props, variables, actionTableData, $$scope, slots];
 }
 
 class List extends SvelteComponent {
@@ -18128,14 +18159,14 @@ function add_css$6(target) {
 	append_styles(target, "svelte-1223veg", ".list-item.svelte-1223veg{margin:0;padding:0}.list-item-inner.svelte-1223veg{display:flex;align-items:center;width:100%;text-decoration:none;color:inherit}.list-item-inner.svelte-1223veg:hover{opacity:0.8}.list-item.svelte-1223veg:not(:first-child){border-top-width:var(--list-item-border-width);border-top-style:var(--list-item-border-style);border-top-color:var(--list-item-border-color)}");
 }
 
-// (29:2) <svelte:element     {...attributes}     this={element}     class="list-item-inner"     style={innerStyle}     on:click={handleClick}   >
+// (30:2) <svelte:element     {...attributes}     this={element}     class="list-item-inner"     style={innerStyle}     on:click={handleClick}   >
 function create_dynamic_element$1(ctx) {
 	let svelte_element;
 	let current;
 	let mounted;
 	let dispose;
-	const default_slot_template = /*#slots*/ ctx[9].default;
-	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[8], null);
+	const default_slot_template = /*#slots*/ ctx[10].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[9], null);
 
 	let svelte_element_levels = [
 		/*attributes*/ ctx[3],
@@ -18178,15 +18209,15 @@ function create_dynamic_element$1(ctx) {
 		},
 		p(ctx, dirty) {
 			if (default_slot) {
-				if (default_slot.p && (!current || dirty & /*$$scope*/ 256)) {
+				if (default_slot.p && (!current || dirty & /*$$scope*/ 512)) {
 					update_slot_base(
 						default_slot,
 						default_slot_template,
 						ctx,
-						/*$$scope*/ ctx[8],
+						/*$$scope*/ ctx[9],
 						!current
-						? get_all_dirty_from_scope(/*$$scope*/ ctx[8])
-						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[8], dirty, null),
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[9])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[9], dirty, null),
 						null
 					);
 				}
@@ -18295,6 +18326,7 @@ function instance$a($$self, $$props, $$invalidate) {
 	let { $$slots: slots = {}, $$scope } = $$props;
 	let { layerId } = $$props;
 	let { props } = $$props;
+	let { item } = $$props;
 	useInjectCustomizeCss(props);
 	const { attributes, element, handleClick } = useClickable(props);
 	const context = getContext(LIST_ITEM_CONTEXT_KEY) || {};
@@ -18302,16 +18334,17 @@ function instance$a($$self, $$props, $$invalidate) {
 	$$self.$$set = $$props => {
 		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
 		if ('props' in $$props) $$invalidate(6, props = $$props.props);
-		if ('$$scope' in $$props) $$invalidate(8, $$scope = $$props.$$scope);
+		if ('item' in $$props) $$invalidate(7, item = $$props.item);
+		if ('$$scope' in $$props) $$invalidate(9, $$scope = $$props.$$scope);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*variables*/ 128) {
+		if ($$self.$$.dirty & /*variables*/ 256) {
 			$$invalidate(2, style = objToStyle(variables));
 		}
 	};
 
-	$$invalidate(7, variables = {
+	$$invalidate(8, variables = {
 		...context.borderTopWidth
 		? {
 				'--list-item-border-width': context.borderTopWidth ?? '0',
@@ -18337,6 +18370,7 @@ function instance$a($$self, $$props, $$invalidate) {
 		element,
 		handleClick,
 		props,
+		item,
 		variables,
 		$$scope,
 		slots
@@ -18346,7 +18380,7 @@ function instance$a($$self, $$props, $$invalidate) {
 class ListItem extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$a, create_fragment$a, safe_not_equal, { layerId: 0, props: 6 }, add_css$6);
+		init(this, options, instance$a, create_fragment$a, safe_not_equal, { layerId: 0, props: 6, item: 7 }, add_css$6);
 	}
 }
 
@@ -18506,7 +18540,7 @@ function add_css$4(target) {
 	append_styles(target, "svelte-1blzs1a", ".multi-column-item.svelte-1blzs1a{margin:0;width:100%;padding-top:0;padding-bottom:0;padding-left:var(--multi-column-item-padding);padding-right:var(--multi-column-item-padding)}.multi-column-item-inner.svelte-1blzs1a{display:flex;flex-direction:column;align-items:center;gap:var(--multi-column-item-gap);width:100%;text-decoration:none;color:inherit;padding-top:var(--multi-column-item-padding-top);padding-left:var(--multi-column-item-padding-left);padding-right:var(--multi-column-item-padding-right);padding-bottom:var(--multi-column-item-padding-bottom)}.multi-column-item-inner.svelte-1blzs1a:hover{opacity:0.8}.multi-column-item.svelte-1blzs1a:not(:first-child){border-left-width:var(--multi-column-item-border-width);border-left-style:var(--multi-column-item-border-style);border-left-color:var(--multi-column-item-border-color)}");
 }
 
-// (29:2) <svelte:element     {...attributes}     this={element}     class="multi-column-item-inner"     on:click={handleClick}   >
+// (28:2) <svelte:element     {...attributes}     this={element}     class="multi-column-item-inner"     on:click={handleClick}   >
 function create_dynamic_element(ctx) {
 	let svelte_element;
 	let current;
@@ -18665,7 +18699,6 @@ function instance$8($$self, $$props, $$invalidate) {
 	useInjectCustomizeCss(props);
 	const { attributes, element, handleClick } = useClickable(props);
 	const context = getContext(MULTI_COLUMN_ITEM_CONTEXT_KEY) || {};
-	console.log(context);
 
 	$$self.$$set = $$props => {
 		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
@@ -18983,12 +19016,6 @@ function instance$6($$self, $$props, $$invalidate) {
 	let timeLimit = props.timeLimit ? new Date(props.timeLimit) : new Date();
 
 	function onEachSecond() {
-		console.log({
-			timeLimit: timeLimit.getTime(),
-			now: new Date().getTime(),
-			calced: calcRemainingTime(timeLimit.getTime())
-		});
-
 		const _remainingTime = calcRemainingTime(timeLimit.getTime());
 
 		if (_remainingTime > 0) {
@@ -19000,8 +19027,6 @@ function instance$6($$self, $$props, $$invalidate) {
 				execOnClickOperation(props.onEnd);
 			}
 		}
-
-		console.log(remainingTime);
 	}
 
 	onMount$1(() => {
@@ -19166,9 +19191,7 @@ function instance$5($$self, $$props, $$invalidate) {
 	let { layerId = '' } = $$props;
 	let countdownStore = getContext('countdownStore');
 	component_subscribe($$self, countdownStore, value => $$invalidate(5, $countdownStore = value));
-	console.log(countdownStore);
 	let { style } = useText(props);
-	console.log(value);
 
 	$$self.$$set = $$props => {
 		if ('props' in $$props) $$invalidate(4, props = $$props.props);
@@ -19312,7 +19335,6 @@ function instance$4($$self, $$props, $$invalidate) {
 	const handleClick = e => {
 		e.preventDefault();
 		const targetText = props.content ?? buttonElement?.innerText ?? '';
-		console.log(targetText);
 		navigator.clipboard.writeText(targetText);
 		send_event('_click_copy', { text: targetText });