@plaidev/karte-action-sdk 1.0.39 → 1.0.42

package/dist/index.es.d.ts

@@ -2,25 +2,6 @@
  * UIから選択できる関数
  */
 import { Writable } from "svelte/store";
-type OPTIONS = {
-    send?: (event_name: string, values?: any) => void;
-    isPreview?: boolean;
-    initialState?: string;
-};
-declare const state: Writable<string>;
-declare const closed: Writable<boolean>;
-declare const maximumZindex: Writable<number>;
-declare const initialize: (options?: OPTIONS) => () => void;
-declare const finalize: () => void;
-declare const send_event: (event_name: string, values?: any) => void;
-declare const isPreview: () => boolean;
-declare const setMiximumZindex: (zindex?: number) => void;
-// eslint-disable-next-line @typescript-eslint/no-empty-function
-declare const none: () => () => void;
-declare const moveTo: (to: string) => () => void;
-declare const linkTo: (to: string, targetBlank?: boolean) => () => void;
-declare const closeApp: () => () => void;
-declare const _default: "dummy";
 declare const PropTypes: readonly [
     "BooleanKeyword",
     "NumberKeyword",
@@ -37,7 +18,9 @@ declare const PropTypes: readonly [
     "Color",
     "Alignment",
     "State",
-    "Style"
+    "Style",
+    "ModalPlacement",
+    "OnClick"
 ];
 type PropType = typeof PropTypes[number];
 type Code = string;
@@ -171,6 +154,96 @@ type ModalPlacement<M = ModalMargin> = {
     backgroundOverlay?: boolean;
 };
 declare const DefaultModalPlacement: Required<ModalPlacement<Required<ModalMargin>>>;
+type I18nLabel<Locale extends string = "ja" | "en"> = {
+    [K in Locale]?: string;
+};
+type BaseOperationOptions = ReadonlyArray<{
+    name: I18nLabel;
+    operation: string;
+    args: ReadonlyArray<{
+        name: I18nLabel;
+        type: keyof OperationArgumentTypes;
+        default: any;
+    }>;
+}>;
+type OperationArgumentTypes = {
+    StringKeyword: string;
+    BooleanKeyword: boolean;
+    NumberKeyword: number;
+    State: string;
+};
+type ConvertOperationOptions<O extends BaseOperationOptions> = ConvertOperationOption<O[number]>;
+type ConvertOperationOption<Option extends BaseOperationOptions[number]> = Option extends any ? {
+    operation: Option["operation"];
+    args: ConvertOperationOptionArguments<Option["args"]>;
+} : never;
+type ConvertOperationOptionArguments<Arguments extends BaseOperationOptions[number]["args"]> = {
+    -readonly [Index in keyof Arguments]: Arguments[Index] extends BaseOperationOptions[number]["args"][number] ? OperationArgumentTypes[Arguments[Index]["type"]] : never;
+};
+type Operation = ConvertOperationOptions<ReadonlyArray<any>>;
+declare const OnClickOperationOptions: readonly [
+    {
+        readonly name: {
+            readonly ja: "\u64CD\u4F5C\u306A\u3057";
+            readonly en: "No Operation";
+        };
+        readonly operation: "none";
+        readonly args: readonly [
+        ];
+    },
+    {
+        readonly name: {
+            readonly ja: "\u30EA\u30F3\u30AF\u9077\u79FB";
+            readonly en: "Link To";
+        };
+        readonly operation: "linkTo";
+        readonly args: readonly [
+            {
+                readonly name: {
+                    readonly ja: "URL\u3092\u5165\u529B";
+                    readonly en: "Enter URL";
+                };
+                readonly type: "StringKeyword";
+                readonly default: "";
+            },
+            {
+                readonly name: {
+                    readonly ja: "\u65B0\u3057\u3044\u30BF\u30D6\u3067\u958B\u304F";
+                    readonly en: "Open in new tab";
+                };
+                readonly type: "BooleanKeyword";
+                readonly default: true;
+            }
+        ];
+    },
+    {
+        readonly name: {
+            readonly ja: "\u30B9\u30C6\u30FC\u30C8\u9077\u79FB";
+            readonly en: "Move To";
+        };
+        readonly operation: "moveTo";
+        readonly args: readonly [
+            {
+                readonly name: {
+                    readonly ja: "\u30B9\u30C6\u30FC\u30C8\u3092\u9078\u629E";
+                    readonly en: "State";
+                };
+                readonly type: "State";
+                readonly default: "/";
+            }
+        ];
+    },
+    {
+        readonly name: {
+            readonly ja: "\u9589\u3058\u308B";
+            readonly en: "Close";
+        };
+        readonly operation: "closeApp";
+        readonly args: readonly [
+        ];
+    }
+];
+type OnClickOperation = ConvertOperationOptions<typeof OnClickOperationOptions>;
 type LongText = string;
 type Url = string;
 type Image = string;
@@ -218,6 +291,26 @@ declare const BackgroundSizes: readonly [
 type BackgroundSize = typeof BackgroundSizes[number];
 type Style = string;
 type StateName = string;
+type OPTIONS = {
+    send?: (event_name: string, values?: any) => void;
+    isPreview?: boolean;
+    initialState?: string;
+};
+declare const state: Writable<string>;
+declare const closed: Writable<boolean>;
+declare const maximumZindex: Writable<number>;
+declare const initialize: (options?: OPTIONS) => () => void;
+declare const finalize: () => void;
+declare const send_event: (event_name: string, values?: any) => void;
+declare const isPreview: () => boolean;
+declare const setMiximumZindex: (zindex?: number) => void;
+// eslint-disable-next-line @typescript-eslint/no-empty-function
+declare const none: () => () => void;
+declare const moveTo: (to: string) => () => void;
+declare const linkTo: (to: string, targetBlank?: boolean) => () => void;
+declare const closeApp: () => () => void;
+declare const execOnClickOperation: (onClickOperation: OnClickOperation) => void;
+declare const _default: "dummy";
 declare const handleFocus: (node: HTMLElement | null) => (e: any) => void;
 declare const setPreviousFocus: () => void;
 declare const handleKeydown: (handlers: {
@@ -275,7 +368,7 @@ declare const collection: (config: {
     } | null | undefined, cb: (err: Error | null, items?: any) => void): void;
     set(key: string, value: string, cb: (err: Error | null) => void): void;
 };
-export { state, closed, maximumZindex, initialize, finalize, send_event, isPreview, setMiximumZindex, none, moveTo, linkTo, closeApp, _default, handleFocus, setPreviousFocus, handleKeydown, getPositionStyle, getMarginStyle, onScroll, onTime, hasSuffix, toBr, randStr, PropTypes, PropType, Code, MediaQueries, MediaQuery, Directions, Direction, AnimationStyles, AnimationStyle, AnimationStyleTranslations, ModalPositions, ModalPosition, ModalPositionTranslations, ModalMarginTranslations, ModalMargin, ModalPlacement, DefaultModalPlacement, LongText, Url, Image, LengthUnits, LengthUnit, Length, Color, Justifies, Justify, Alignments, Alignment, ObjectFits, ObjectFit, Repeats, Repeat, BackgroundSizes, BackgroundSize, Style, StateName, hideOnScroll, hideOnTime, showOnScroll, showOnTime, ensureModalRoot, h, createFog, EmbedLogic, embed, collection };
+export { state, closed, maximumZindex, initialize, finalize, send_event, isPreview, setMiximumZindex, none, moveTo, linkTo, closeApp, execOnClickOperation, _default, handleFocus, setPreviousFocus, handleKeydown, getPositionStyle, getMarginStyle, onScroll, onTime, hasSuffix, toBr, randStr, PropTypes, PropType, Code, MediaQueries, MediaQuery, Directions, Direction, AnimationStyles, AnimationStyle, AnimationStyleTranslations, ModalPositions, ModalPosition, ModalPositionTranslations, ModalMarginTranslations, ModalMargin, ModalPlacement, DefaultModalPlacement, Operation, OnClickOperationOptions, OnClickOperation, LongText, Url, Image, LengthUnits, LengthUnit, Length, Color, Justifies, Justify, Alignments, Alignment, ObjectFits, ObjectFit, Repeats, Repeat, BackgroundSizes, BackgroundSize, Style, StateName, hideOnScroll, hideOnTime, showOnScroll, showOnTime, ensureModalRoot, h, createFog, EmbedLogic, embed, collection };
 export { default as State } from './components/State.svelte';
 export { default as StateItem } from './components/StateItem.svelte';
 export { default as Modal } from './components/Modal.svelte';

package/dist/index.es.js

@@ -162,6 +162,17 @@ const closeApp = () => () => {
     send_event('message_close', null);
     closed.set(true);
 };
+const execOnClickOperation = (onClickOperation) => {
+    if (onClickOperation.operation === 'linkTo') {
+        linkTo(...onClickOperation.args)();
+    }
+    else if (onClickOperation.operation === 'moveTo') {
+        moveTo(...onClickOperation.args)();
+    }
+    else if (onClickOperation.operation === 'closeApp') {
+        closeApp()();
+    }
+};
 
 const PropTypes = [
     'BooleanKeyword',
@@ -180,6 +191,8 @@ const PropTypes = [
     'Alignment',
     'State',
     'Style',
+    'ModalPlacement',
+    'OnClick',
 ];
 const MediaQueries = {
     PC: '(\\s*min-width\\s*:\\s*1025px\\s*)',
@@ -304,6 +317,27 @@ const DefaultModalPlacement = {
     },
     backgroundOverlay: false,
 };
+const OnClickOperationOptions = [
+    { name: { ja: '操作なし', en: 'No Operation' }, operation: 'none', args: [] },
+    {
+        name: { ja: 'リンク遷移', en: 'Link To' },
+        operation: 'linkTo',
+        args: [
+            { name: { ja: 'URLを入力', en: 'Enter URL' }, type: 'StringKeyword', default: '' },
+            {
+                name: { ja: '新しいタブで開く', en: 'Open in new tab' },
+                type: 'BooleanKeyword',
+                default: true,
+            },
+        ],
+    },
+    {
+        name: { ja: 'ステート遷移', en: 'Move To' },
+        operation: 'moveTo',
+        args: [{ name: { ja: 'ステートを選択', en: 'State' }, type: 'State', default: '/' }],
+    },
+    { name: { ja: '閉じる', en: 'Close' }, operation: 'closeApp', args: [] },
+];
 const LengthUnits = ['px', 'em', 'rem', 'vw', 'fr', '%'];
 const Justifies = ['flex-start', 'center', 'flex-end'];
 const Alignments = ['flex-start', 'center', 'flex-end'];
@@ -873,7 +907,7 @@ function add_css$6(target) {
 	append_styles(target, "svelte-1bxl6mz", ".modal.svelte-1bxl6mz{position:fixed;box-sizing:border-box;z-index:2147483647}.close.svelte-1bxl6mz{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-1bxl6mz:hover{transform:rotate(90deg)}");
 }
 
-// (116:4) {#if closable}
+// (148:4) {#if closable}
 function create_if_block(ctx) {
 	let button;
 	let svg;
@@ -925,7 +959,7 @@ function create_if_block(ctx) {
 	};
 }
 
-// (103:0) <Animation {animation}>
+// (135:0) <Animation {animation}>
 function create_default_slot$1(ctx) {
 	let div;
 	let t;
@@ -934,8 +968,8 @@ function create_default_slot$1(ctx) {
 	let mounted;
 	let dispose;
 	let if_block = /*closable*/ ctx[2] && create_if_block(ctx);
-	const default_slot_template = /*#slots*/ ctx[20].default;
-	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[22], null);
+	const default_slot_template = /*#slots*/ ctx[22].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[24], null);
 
 	return {
 		c() {
@@ -957,7 +991,7 @@ function create_default_slot$1(ctx) {
 				default_slot.m(div, null);
 			}
 
-			/*div_binding*/ ctx[21](div);
+			/*div_binding*/ ctx[23](div);
 			current = true;
 
 			if (!mounted) {
@@ -980,15 +1014,15 @@ function create_default_slot$1(ctx) {
 			}
 
 			if (default_slot) {
-				if (default_slot.p && (!current || dirty & /*$$scope*/ 4194304)) {
+				if (default_slot.p && (!current || dirty & /*$$scope*/ 16777216)) {
 					update_slot_base(
 						default_slot,
 						default_slot_template,
 						ctx,
-						/*$$scope*/ ctx[22],
+						/*$$scope*/ ctx[24],
 						!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[24])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[24], dirty, null),
 						null
 					);
 				}
@@ -1011,7 +1045,7 @@ function create_default_slot$1(ctx) {
 			if (detaching) detach(div);
 			if (if_block) if_block.d();
 			if (default_slot) default_slot.d(detaching);
-			/*div_binding*/ ctx[21](null);
+			/*div_binding*/ ctx[23](null);
 			mounted = false;
 			dispose();
 		}
@@ -1066,7 +1100,7 @@ function create_fragment$8(ctx) {
 			const animation_1_changes = {};
 			if (dirty & /*animation*/ 1) animation_1_changes.animation = /*animation*/ ctx[0];
 
-			if (dirty & /*$$scope, pos, marginStyle, _style, modal, $maximumZindex, _closeStyle, closeButtonColor, closable*/ 4195070) {
+			if (dirty & /*$$scope, pos, marginStyle, _style, modal, $maximumZindex, _closeStyle, closeButtonColor, closable*/ 16777982) {
 				animation_1_changes.$$scope = { dirty, ctx };
 			}
 
@@ -1102,6 +1136,11 @@ function instance$8($$self, $$props, $$invalidate) {
 	let $maximumZindex;
 	component_subscribe($$self, maximumZindex, $$value => $$invalidate(9, $maximumZindex = $$value));
 	let { $$slots: slots = {}, $$scope } = $$props;
+	let { onClick = { operation: 'none', args: [] } } = $$props;
+
+	/**
+ * {"hidden": true}
+ */
 	const dispatchClick = createEventDispatcher();
 
 	const click = () => {
@@ -1109,7 +1148,11 @@ function instance$8($$self, $$props, $$invalidate) {
 			send_event(clickEventName, clickEventValue);
 		}
 
-		dispatchClick('click');
+		if (onClick.operation !== 'none') {
+			execOnClickOperation(onClick);
+		} else {
+			dispatchClick('click');
+		}
 	};
 
 	let { clickEventName = '' } = $$props;
@@ -1118,9 +1161,10 @@ function instance$8($$self, $$props, $$invalidate) {
 	let { animation = 'none' } = $$props;
 	let { _style = '' } = $$props;
 	let { closable = true } = $$props;
+	let { onClose = { operation: 'none', args: [] } } = $$props;
 
 	/**
- * {"title": {"ja": "イベントタイプ", "en": "Event Type"}, "folder": {"ja": "閉じるボタン", "en": "Close Button"}}
+ * {"hidden": true}
  */
 	const dispatchClose = createEventDispatcher();
 
@@ -1129,7 +1173,11 @@ function instance$8($$self, $$props, $$invalidate) {
 			send_event(closeEventName, closeEventValue);
 		}
 
-		dispatchClose('close');
+		if (onClose.operation !== 'none') {
+			execOnClickOperation(onClose);
+		} else {
+			dispatchClose('close');
+		}
 	};
 
 	let { closeButtonColor = '#000000' } = $$props;
@@ -1148,36 +1196,38 @@ function instance$8($$self, $$props, $$invalidate) {
 	}
 
 	$$self.$$set = $$props => {
-		if ('clickEventName' in $$props) $$invalidate(13, clickEventName = $$props.clickEventName);
-		if ('clickEventValue' in $$props) $$invalidate(14, clickEventValue = $$props.clickEventValue);
-		if ('placement' in $$props) $$invalidate(15, placement = $$props.placement);
+		if ('onClick' in $$props) $$invalidate(13, onClick = $$props.onClick);
+		if ('clickEventName' in $$props) $$invalidate(14, clickEventName = $$props.clickEventName);
+		if ('clickEventValue' in $$props) $$invalidate(15, clickEventValue = $$props.clickEventValue);
+		if ('placement' in $$props) $$invalidate(16, placement = $$props.placement);
 		if ('animation' in $$props) $$invalidate(0, animation = $$props.animation);
 		if ('_style' in $$props) $$invalidate(1, _style = $$props._style);
 		if ('closable' in $$props) $$invalidate(2, closable = $$props.closable);
+		if ('onClose' in $$props) $$invalidate(17, onClose = $$props.onClose);
 		if ('closeButtonColor' in $$props) $$invalidate(3, closeButtonColor = $$props.closeButtonColor);
-		if ('closeEventName' in $$props) $$invalidate(16, closeEventName = $$props.closeEventName);
-		if ('closeEventValue' in $$props) $$invalidate(17, closeEventValue = $$props.closeEventValue);
+		if ('closeEventName' in $$props) $$invalidate(18, closeEventName = $$props.closeEventName);
+		if ('closeEventValue' in $$props) $$invalidate(19, closeEventValue = $$props.closeEventValue);
 		if ('_closeStyle' in $$props) $$invalidate(4, _closeStyle = $$props._closeStyle);
-		if ('$$scope' in $$props) $$invalidate(22, $$scope = $$props.$$scope);
+		if ('$$scope' in $$props) $$invalidate(24, $$scope = $$props.$$scope);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*placement*/ 32768) {
+		if ($$self.$$.dirty & /*placement*/ 65536) {
 			$$invalidate(8, backgroundOverray = placement && placement.backgroundOverlay != null
 			? placement.backgroundOverlay
 			: DefaultModalPlacement.backgroundOverlay);
 		}
 
-		if ($$self.$$.dirty & /*placement*/ 32768) {
-			$$invalidate(19, overwritePosition = isPreview()
+		if ($$self.$$.dirty & /*placement*/ 65536) {
+			$$invalidate(21, overwritePosition = isPreview()
 			? 'center'
 			: placement && placement.position != null
 				? placement.position
 				: DefaultModalPlacement.position);
 		}
 
-		if ($$self.$$.dirty & /*placement*/ 32768) {
-			$$invalidate(18, overwriteMargin = isPreview()
+		if ($$self.$$.dirty & /*placement*/ 65536) {
+			$$invalidate(20, overwriteMargin = isPreview()
 			? {
 					left: '0px',
 					right: '0px',
@@ -1189,11 +1239,11 @@ function instance$8($$self, $$props, $$invalidate) {
 				: DefaultModalPlacement.margin);
 		}
 
-		if ($$self.$$.dirty & /*overwritePosition*/ 524288) {
+		if ($$self.$$.dirty & /*overwritePosition*/ 2097152) {
 			$$invalidate(7, pos = getPositionStyle(overwritePosition));
 		}
 
-		if ($$self.$$.dirty & /*overwriteMargin*/ 262144) {
+		if ($$self.$$.dirty & /*overwriteMargin*/ 1048576) {
 			$$invalidate(6, marginStyle = getMarginStyle(overwriteMargin));
 		}
 	};
@@ -1212,9 +1262,11 @@ function instance$8($$self, $$props, $$invalidate) {
 		click,
 		close,
 		handle_keydown,
+		onClick,
 		clickEventName,
 		clickEventValue,
 		placement,
+		onClose,
 		closeEventName,
 		closeEventValue,
 		overwriteMargin,
@@ -1236,15 +1288,17 @@ class Modal extends SvelteComponent {
 			create_fragment$8,
 			safe_not_equal,
 			{
-				clickEventName: 13,
-				clickEventValue: 14,
-				placement: 15,
+				onClick: 13,
+				clickEventName: 14,
+				clickEventValue: 15,
+				placement: 16,
 				animation: 0,
 				_style: 1,
 				closable: 2,
+				onClose: 17,
 				closeButtonColor: 3,
-				closeEventName: 16,
-				closeEventValue: 17,
+				closeEventName: 18,
+				closeEventValue: 19,
 				_closeStyle: 4
 			},
 			add_css$6
@@ -1417,7 +1471,7 @@ function create_default_slot_2(ctx) {
 	};
 }
 
-// (115:2) <Modal     {placement}     {animation}     {closable}     {closeButtonColor}     {_closeStyle}     _style={_modalStyle}     {clickEventName}     {clickEventValue}     on:click={click}     {closeEventName}     {closeEventValue}     on:close={close}   >
+// (118:2) <Modal     {placement}     {animation}     {closable}     {closeButtonColor}     {_closeStyle}     _style={_modalStyle}     {clickEventName}     {clickEventValue}     on:click={click}     {closeEventName}     {closeEventValue}     on:close={close}   >
 function create_default_slot_1(ctx) {
 	let grid;
 	let current;
@@ -1473,7 +1527,7 @@ function create_default_slot_1(ctx) {
 	};
 }
 
-// (114:0) <StateItem {path}>
+// (117:0) <StateItem {path}>
 function create_default_slot(ctx) {
 	let modal;
 	let current;
@@ -2175,12 +2229,10 @@ function create_fragment$1(ctx) {
 
 function instance$1($$self, $$props, $$invalidate) {
 	let { text = 'ボタンラベル' } = $$props;
+	let { onClick = { operation: 'none', args: [] } } = $$props;
 
 	/**
- * {
- * "title": {"ja": "イベントタイプ", "en": "Event Type"},
- * "folder": {"ja": "クリックイベント", "en": "Click Event"}
- * }
+ * {"hidden": true}
  */
 	const dispatch = createEventDispatcher();
 
@@ -2189,7 +2241,11 @@ function instance$1($$self, $$props, $$invalidate) {
 			send_event(eventName);
 		}
 
-		dispatch('click');
+		if (onClick.operation !== 'none') {
+			execOnClickOperation(onClick);
+		} else {
+			dispatch('click');
+		}
 	};
 
 	let { eventName = '' } = $$props;
@@ -2198,12 +2254,13 @@ function instance$1($$self, $$props, $$invalidate) {
 
 	$$self.$$set = $$props => {
 		if ('text' in $$props) $$invalidate(0, text = $$props.text);
-		if ('eventName' in $$props) $$invalidate(4, eventName = $$props.eventName);
+		if ('onClick' in $$props) $$invalidate(4, onClick = $$props.onClick);
+		if ('eventName' in $$props) $$invalidate(5, eventName = $$props.eventName);
 		if ('_buttonStyle' in $$props) $$invalidate(1, _buttonStyle = $$props._buttonStyle);
 		if ('_style' in $$props) $$invalidate(2, _style = $$props._style);
 	};
 
-	return [text, _buttonStyle, _style, click, eventName];
+	return [text, _buttonStyle, _style, click, onClick, eventName];
 }
 
 class TextButtonBlock extends SvelteComponent {
@@ -2218,7 +2275,8 @@ class TextButtonBlock extends SvelteComponent {
 			safe_not_equal,
 			{
 				text: 0,
-				eventName: 4,
+				onClick: 4,
+				eventName: 5,
 				_buttonStyle: 1,
 				_style: 2
 			},
@@ -2230,7 +2288,7 @@ class TextButtonBlock extends SvelteComponent {
 /* src/components/ImageBlock.svelte generated by Svelte v3.44.1 */
 
 function add_css(target) {
-	append_styles(target, "svelte-ci8ktf", ".image-block.svelte-ci8ktf{display:flex;width:100%;height:100%;max-width:100%;max-height:100%;justify-content:center;align-items:center;overflow:hidden;box-sizing:border-box}.image.svelte-ci8ktf{width:100%;height:100%}.transport.svelte-ci8ktf:hover,.transport.svelte-ci8ktf:focus{opacity:.75;box-shadow:0 5px 16px rgba(0,0,0,.1), 0 8px 28px rgba(0,0,0,.16)}");
+	append_styles(target, "svelte-wa67vf", ".image-block.svelte-wa67vf{display:flex;width:100%;height:100%;max-width:100%;max-height:100%;justify-content:center;align-items:center;overflow:hidden;box-sizing:border-box}.image.svelte-wa67vf{width:100%;height:100%}.transport.svelte-wa67vf:hover,.transport.svelte-wa67vf: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) {
@@ -2245,14 +2303,14 @@ function create_fragment(ctx) {
 		c() {
 			div = element("div");
 			img = element("img");
-			attr(img, "class", "image svelte-ci8ktf");
+			attr(img, "class", "image svelte-wa67vf");
 			attr(img, "loading", "lazy");
 			attr(img, "width", "auto");
 			attr(img, "height", "auto");
 			attr(img, "style", /*_imageStyle*/ 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-ci8ktf"));
+			attr(div, "class", div_class_value = "" + (null_to_empty('image-block' + (/*transport*/ ctx[2] ? ' transport' : '')) + " svelte-wa67vf"));
 			attr(div, "style", /*_style*/ ctx[4]);
 		},
 		m(target, anchor) {
@@ -2277,7 +2335,7 @@ 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-ci8ktf"))) {
+			if (dirty & /*transport*/ 4 && div_class_value !== (div_class_value = "" + (null_to_empty('image-block' + (/*transport*/ ctx[2] ? ' transport' : '')) + " svelte-wa67vf"))) {
 				attr(div, "class", div_class_value);
 			}
 
@@ -2299,9 +2357,10 @@ 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 { onClick = { operation: 'none', args: [] } } = $$props;
 
 	/**
- * {"title": {"ja": "イベントタイプ", "en": "Event Type"}, "folder": {"ja": "クリックイベント", "en": "Click Event"}}
+ * {"hidden": true}
  */
 	const dispatch = createEventDispatcher();
 
@@ -2310,7 +2369,11 @@ function instance($$self, $$props, $$invalidate) {
 			send_event(eventName);
 		}
 
-		dispatch('click');
+		if (onClick.operation !== 'none') {
+			execOnClickOperation(onClick);
+		} else {
+			dispatch('click');
+		}
 	};
 
 	let { eventName = '' } = $$props;
@@ -2321,12 +2384,13 @@ function instance($$self, $$props, $$invalidate) {
 		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 ('eventName' in $$props) $$invalidate(6, eventName = $$props.eventName);
+		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);
 	};
 
-	return [src, alt, transport, _imageStyle, _style, click, eventName];
+	return [src, alt, transport, _imageStyle, _style, click, onClick, eventName];
 }
 
 class ImageBlock extends SvelteComponent {
@@ -2343,7 +2407,8 @@ class ImageBlock extends SvelteComponent {
 				src: 0,
 				alt: 1,
 				transport: 2,
-				eventName: 6,
+				onClick: 6,
+				eventName: 7,
 				_imageStyle: 3,
 				_style: 4
 			},
@@ -2352,4 +2417,4 @@ class ImageBlock extends SvelteComponent {
 	}
 }
 
-export { Alignments, AnimationStyleTranslations, AnimationStyles, BackgroundSizes, DefaultModalPlacement, Directions, Flex, FlexItem, Grid, GridItem, GridModalState, ImageBlock, Justifies, LengthUnits, MediaQueries, Modal, ModalMarginTranslations, ModalPositionTranslations, ModalPositions, ObjectFits, PropTypes, Repeats, State, StateItem, TextBlock, TextButtonBlock, closeApp, closed, collection, createFog, embed, ensureModalRoot, finalize, getMarginStyle, getPositionStyle, h, handleFocus, handleKeydown, hasSuffix, hideOnScroll, hideOnTime, initialize, isPreview, linkTo, maximumZindex, moveTo, none, onScroll, onTime, randStr, send_event, setMiximumZindex, setPreviousFocus, showOnScroll, showOnTime, state, toBr };
+export { Alignments, AnimationStyleTranslations, AnimationStyles, BackgroundSizes, DefaultModalPlacement, Directions, Flex, FlexItem, Grid, GridItem, GridModalState, ImageBlock, Justifies, LengthUnits, MediaQueries, Modal, ModalMarginTranslations, ModalPositionTranslations, ModalPositions, ObjectFits, OnClickOperationOptions, PropTypes, Repeats, State, StateItem, TextBlock, TextButtonBlock, closeApp, closed, collection, createFog, embed, ensureModalRoot, execOnClickOperation, finalize, getMarginStyle, getPositionStyle, h, handleFocus, handleKeydown, hasSuffix, hideOnScroll, hideOnTime, initialize, isPreview, linkTo, maximumZindex, moveTo, none, onScroll, onTime, randStr, send_event, setMiximumZindex, setPreviousFocus, showOnScroll, showOnTime, state, toBr };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plaidev/karte-action-sdk",
-  "version": "1.0.39",
+  "version": "1.0.42",
   "author": "Plaid Inc.",
   "license": "Apache-2.0",
   "module": "./dist/index.es.js",