@plaidev/karte-action-sdk 1.1.114 → 1.1.115-27927583.61884118

package/dist/hydrate/index.es.js

@@ -3,16 +3,13 @@ import 'svelte/easing';
 import { SvelteComponent, init, safe_not_equal, append_styles, create_slot, create_component, space, claim_component, claim_space, mount_component, insert_hydration, update_slot_base, get_all_dirty_from_scope, get_slot_changes, transition_in, transition_out, destroy_component, detach, empty, group_outros, check_outros, component_subscribe, element, claim_element, children, attr, noop, listen, is_function, append_hydration, add_render_callback, create_in_transition, svg_element, claim_svg_element, binding_callbacks, destroy_each, text, claim_text, set_data, null_to_empty, src_url_equal, set_style, run_all } from 'svelte/internal';
 import { setContext, getContext, createEventDispatcher, onMount, onDestroy as onDestroy$1 } from 'svelte';
 
-/**
- * @internal
- */
+/** @internal */
 const NOOP = (_args) => { }; // eslint-disable-line @typescript-eslint/no-unused-vars
-/**
- * @internal
- */
+/** @internal */
 const isPreview = () => {
     return true;
 };
+/** @internal */
 const handleFocus = (node) => (e) => {
     if (node) {
         // trap focus
@@ -27,12 +24,14 @@ const handleFocus = (node) => (e) => {
         e.preventDefault();
     }
 };
+/** @internal */
 const setPreviousFocus = () => {
     const previously_focused = typeof document !== 'undefined' && document.activeElement;
     if (previously_focused) {
         previously_focused?.focus();
     }
 };
+/** @internal */
 const handleKeydown = (handlers) => (e) => {
     if (handlers[e.key]) {
         handlers[e.key](e);
@@ -62,6 +61,7 @@ const TRANSFORM = {
     'bottom-right': [0, 0],
     none: [0, 0],
 };
+/** @internal */
 const getPositionStyle = (position) => {
     const style = POSITION_STYLES[position];
     if (style != null) {
@@ -72,6 +72,7 @@ const getPositionStyle = (position) => {
         return POSITION_STYLES['center'];
     }
 };
+/** @internal */
 const getTransform = (position) => {
     const transform = TRANSFORM[position];
     if (transform != null) {
@@ -82,6 +83,7 @@ const getTransform = (position) => {
         return TRANSFORM['center'];
     }
 };
+/** @internal */
 const getMarginStyle = (margin) => {
     return `margin: ${margin?.top ?? 0} ${margin?.right ?? 0} ${margin?.bottom ?? 0} ${margin?.left ?? 0};`;
 };
@@ -92,6 +94,8 @@ const getMarginStyle = (margin) => {
  * @param fn - スクロール率が達したときに呼び出されるコールバック関数
  *
  * @returns スクロール率によって呼び出されるコールバックを停止する関数を返します
+ *
+ * @public
  */
 function onScroll(rate, fn) {
     const rates = Array.isArray(rate) ? rate : [rate];
@@ -178,25 +182,24 @@ function onScroll(rate, fn) {
  * @param fn - 指定した時間が経過後に呼び出されるコールバック関数
  *
  * @returns コールバックを呼び出すためのタイマーを停止する関数を返します
+ *
+ * @public
  */
 function onTime(time, fn) {
     const timeoutHandler = setTimeout(fn, time);
     return () => timeoutHandler && clearTimeout(timeoutHandler);
 }
+/** @internal */
 function hasSuffix(value, suffix) {
     return new RegExp(`[0-9]${suffix}$`).test(value);
 }
-function toBr(text) {
-    return text.replace(/\r?\n/g, '<br>');
-}
-function randStr(digit = 8) {
-    return Math.random().toString(32).substring(digit);
-}
 
 /**
  * get store state value
  *
  * @deprecated 非推奨
+ *
+ * @internal
  */
 const getStoreState = get;
 /**
@@ -207,16 +210,23 @@ const actionSetting = writable({ autoStart: true });
  * {@link getActionSetting} function to get action setting.
  *
  * @returns Current action setting
+ *
+ * @internal
  */
 function getActionSetting() {
     return get(actionSetting);
 }
 /**
- * {@link setActionSetting} function to "update" action setting
+ * アクション設定を更新する
  *
- * @param setting - Updated action setting
+ * @remarks
+ * アクションの自動起動 (autoStart) を設定できます。
+ *
+ * @param setting - 更新するアクション設定
  *
- * @returns New action setting
+ * @returns 新しいアクション設定
+ *
+ * @public
  */
 function setActionSetting(setting) {
     actionSetting.update(current => {
@@ -228,6 +238,8 @@ function setActionSetting(setting) {
 }
 /**
  * {@link resetActionSetting} function to reset action setting
+ *
+ * @internal
  */
 function resetActionSetting() {
     actionSetting.set({ autoStart: true });
@@ -238,15 +250,23 @@ function resetActionSetting() {
  */
 const system = writable({});
 /**
- * {@link getSystem} function to get KARTE system config.
+ * KARTE の設定を取得する
+ *
+ * @remarks
+ * アクションが表示されて設定されるため、{@link onShow} フック関数で利用できます。
+ * 取得できる設定は、APIキー、接客ID、アクションショートIDなどです。
  *
- * @returns Current karte system config
+ * @returns 現在の KARTE システムの設定を返します
+ *
+ * @public
  */
 function getSystem() {
     return get(system);
 }
 /**
  * {@link setSystem} function to set KARTE system config.
+ *
+ * @internal
  */
 function setSystem(config) {
     system.set(config);
@@ -256,10 +276,17 @@ function setSystem(config) {
  *
  * This is exported becase of compatible interface for App.svelte.
  * Don't use directly.
+ *
+ * @internal
  */
 const state = writable('/');
 /**
- * {@link setState} function to set current state ID.
+ * 現在のステートを設定する
+ *
+ * @param stateId - 表示するステートID
+ * @param force - 強制的にステートを設定するフラグ。デフォルトは `false`
+ *
+ * @public
  */
 function setState$1(stateId, force = false) {
     if (!force && isPreview())
@@ -267,21 +294,30 @@ function setState$1(stateId, force = false) {
     state.set(stateId);
 }
 /**
- * {@link getState} function to get current state ID.
+ * 現在のステートを取得する
+ *
+ * @remarks
+ * アクションが表示されて設定されるため、{@link onShow} フック関数で利用できます。
+ *
+ * @returns 現在のステートID
  *
- * @returns Current state ID
+ * @public
  */
 function getState$1() {
     return get(state);
 }
 /**
  * Store to handle all state IDs
+ *
+ * @internal
  */
 const states = writable([]);
 /**
  * {@link getStates} function to add new state ID to list of state IDs.
  *
  * @param stateId - New state ID
+ *
+ * @internal
  */
 function addState(stateId) {
     states.update(current => {
@@ -290,27 +326,38 @@ function addState(stateId) {
     });
 }
 /**
- * {@link getStates} function to get a list of all state IDs.
+ * ステートID一覧を取得する
+ *
+ * @remarks
+ * アクションが表示されて設定されるため、{@link onShow} フック関数で利用できます。
+ *
+ * @returns すべてのステートID
  *
- * @returns All state IDs
+ * @public
  */
 function getStates() {
     return get(states);
 }
 /**
  * Store to handle visibility of action
+ *
+ * @internal
  */
 const opened = writable(true);
 /**
- * {@link isOpened} function to check if action is opened.
+ * アクションの表示・非表示の状態を取得する
+ *
+ * @returns アクションが表示されているときは `true`、非表示のときは `false` を返します。
  *
- * @returns Flag if action is opend / true: Opend, false: Not opened
+ * @public
  */
 function isOpened() {
     return get(opened);
 }
 /**
  * {@link setOpened} function to set if action is opened.
+ *
+ * @internal
  */
 function setOpened(on) {
     opened.set(on);
@@ -319,6 +366,8 @@ function setOpened(on) {
  * Store to handle visibility of action
  *
  * @deprecated 非推奨
+ *
+ * @internal
  */
 const closed = writable(false); // deprecated
 /**
@@ -327,6 +376,8 @@ const closed = writable(false); // deprecated
  * @returns Flag if action is closed / true: Closed, false: Not closed
  *
  * @deprecated 非推奨
+ *
+ * @internal
  */
 function isClosed() {
     return get(closed);
@@ -335,16 +386,22 @@ function isClosed() {
  * {@link setClosed} function to set if action is closed.
  *
  * @deprecated 非推奨
+ *
+ * @internal
  */
 function setClosed(on) {
     closed.set(on);
 }
 /**
  * Store to handle max z-index for grid items
+ *
+ * @internal
  */
 const maximumZindex = writable(0);
 /**
  * Set maximum z-index.
+ *
+ * @internal
  */
 const setMaximumZindex = (zindex) => {
     if (!zindex || zindex < get(maximumZindex))
@@ -354,23 +411,19 @@ const setMaximumZindex = (zindex) => {
 /**
  * Store to handle internal event handlers
  *
- * This is used internally.
+ * @internal
  */
 const internalHandlers = writable({});
 /**
  * {@link getInternalHandlers} function to get internal event handlers.
  *
  * @returns Current internal handlers
+ *
+ * @internal
  */
 function getInternalHandlers() {
     return get(internalHandlers);
 }
-/**
- * {@link setInternalHandlers} function to set internal event handlers.
- */
-function setInternalHandlers(handlers) {
-    internalHandlers.set(handlers);
-}
 /**
  * {@link updateInternalHandlers} function to update internal event handlers.
  *
@@ -388,30 +441,41 @@ function updateInternalHandlers(handlers) {
  * Store to handle custom event handlers
  *
  * This is used internally.
+ *
+ * @internal
  */
 const customHandlers = writable({});
 /**
- * {@link getCustomHandlers} function to get custom event handlers.
+ * カスタムイベントハンドラーの一覧を取得する
  *
- * @returns Current custom event handlers
+ * @returns 現在のカスタムイベントハンドラー
+ *
+ * @public
  */
 function getCustomHandlers() {
     return get(customHandlers);
 }
 /**
- * {@link setCustomHandlers} function to set custom event handlers.
+ * カスタムイベントハンドラーを登録する
+ *
+ * @remarks
+ * 登録したカスタムイベントハンドラーは、ビジュアルエディタでアクション本体とのテキストボタンのクリック時の動作で利用できます。
  *
- * @param handlers - New custom event handlers
+ * @param handlers - 登録するカスタムイベントハンドラー
+ *
+ * @public
  */
 function setCustomHandlers(handlers) {
     customHandlers.set(handlers);
 }
 /**
- * {@link updateCustomHandlers} function to update custom event handlers.
+ * カスタムイベントハンドラーを更新する
  *
- * @param handlers - Updated custom event handlers
+ * @param handlers - 対象となるカスタムイベントハンドラー
  *
- * @returns New custom event handlers
+ * @returns 新しいカスタムイベントハンドラーを返します。
+ *
+ * @public
  */
 function updateCustomHandlers(handlers) {
     customHandlers.update(current => {
@@ -421,23 +485,32 @@ function updateCustomHandlers(handlers) {
 }
 /**
  * Store to handle destruction of action
+ *
+ * @internal
  */
 const destroyed = writable(false);
 /**
  * {@link isDestroyed} function to check if action is destroyed.
  *
  * @returns Flag if action is destoryed / true: Destroyed, false: Not Destroyed
+ *
+ * @internal
  */
 function isDestroyed() {
     return get(destroyed);
 }
 /**
- * {@link setDestroyed} function to set if action is destroyed. */
+ * {@link setDestroyed} function to set if action is destroyed.
+ *
+ * @internal
+ */
 function setDestroyed(on) {
     destroyed.set(on);
 }
 /**
  * Store to handle stopping action
+ *
+ * @internal
  */
 const stopped = writable(false);
 /**
@@ -450,6 +523,8 @@ function isStopped() {
 }
 /**
  * {@link setStopped} function to set if action is stopped.
+ *
+ * @internal
  */
 function setStopped(on) {
     {
@@ -458,30 +533,41 @@ function setStopped(on) {
 }
 /**
  * Store to handle custom variables
+ *
+ * @internal
  */
 const customVariables = writable({});
 /**
- * {@link getCustomVariables} function to get custom variables.
+ * カスタム変数の一覧を取得する
+ *
+ * @returns 現在のカスタム変数の一覧
  *
- * @returns Current custom variables
+ * @public
  */
 function getCustomVariables() {
     return get(customVariables);
 }
 /**
- * {@link setCustomVariables} function to set custom variables.
+ * カスタム変数を設定する
+ *
+ * @remarks
+ * 設定した変数は、ビジュアルエディタのテキストフォームなどで利用できます。
+ *
+ * @param variables - カスタム変数
  *
- * @param variables - New custom variables
+ * @public
  */
 function setCustomVariables(variables) {
     customVariables.set(variables);
 }
 /**
- * {@link updateCustomVariables} function to update custom variables.
+ * カスタム変数を更新する
+ *
+ * @param variables - 更新するカスタム変数
  *
- * @param variables - Updated custom variables
+ * @returns 新しいカスタム変数を返します。
  *
- * @returns New custom variables
+ * @public
  */
 function updateCustomVariables(variables) {
     customVariables.update(current => {
@@ -491,21 +577,32 @@ function updateCustomVariables(variables) {
 }
 /**
  * Store for form data
+ *
+ * @internal
  */
 const formData = writable({});
 
+/** @internal */
 const ALL_ACTION_ID = 'KARTE_ALL_ACTION_ID';
+/** @internal */
 const ALL_ACTION_SHORTEN_ID = 'KARTE_ALL_ACTION_SHORTEN_ID';
+/** @internal */
 const actionId = ALL_ACTION_ID ;
+/** @internal */
 const ACTION_SHOW_EVENT = `KARTE-ACTION-SHOW-${actionId}`;
+/** @internal */
 const ACTION_CLOSE_EVENT = `KARTE-ACTION-CLOSE-${actionId}`;
+/** @internal */
 const ACTION_DESTROY_EVENT = `KARTE-ACTION-DESTROY-${actionId}`;
+/** @internal */
 const ACTION_CHANGE_STATE_EVENT = `KARTE-ACTION-CHANGE-STATE-${actionId}`;
+/** @internal */
 const handleState = (event) => {
     if (event.detail.actionId === actionId || event.detail.actionId === ALL_ACTION_ID) {
         setState$1(event.detail.to, event.detail.force);
     }
 };
+/** @internal */
 const initialize = (setting) => {
     const newSetting = setActionSetting(setting);
     if (newSetting.initialState) {
@@ -519,19 +616,21 @@ const initialize = (setting) => {
     setClosed(false); // deprecated
     return () => finalize();
 };
+/** @internal */
 const finalize = () => {
     resetActionSetting();
 };
+/** @internal */
 const send_event = (event_name, values) => {
     const setting = getActionSetting();
     setting?.send?.(event_name, values);
 };
-// eslint-disable-next-line @typescript-eslint/no-empty-function
-const none = () => () => { };
+/** @internal */
 const moveTo = (to) => () => {
     send_event('_message_state_changed', { state: to });
     window.dispatchEvent(new CustomEvent(ACTION_CHANGE_STATE_EVENT, { detail: { to, actionId } }));
 };
+/** @internal */
 const linkTo = (to, targetBlank = true) => () => {
     send_event('message_click', { url: to, state: getState$1() });
     if (targetBlank) {
@@ -541,9 +640,11 @@ const linkTo = (to, targetBlank = true) => () => {
         location.href = to;
     }
 };
+/** @internal */
 const closeApp = (trigger) => () => {
     window.dispatchEvent(new CustomEvent(ACTION_CLOSE_EVENT, { detail: { trigger } }));
 };
+/** @internal */
 const runScript = (handlerName) => () => {
     const handlers = get(customHandlers);
     const handler = handlers[handlerName];
@@ -556,6 +657,7 @@ const runScript = (handlerName) => () => {
         console.warn('Failed to run custom handler', handlerName, e);
     }
 };
+/** @internal */
 const execOnClickOperation = (onClickOperation) => {
     if (onClickOperation.operation === 'linkTo') {
         linkTo(...onClickOperation.args)();
@@ -570,6 +672,7 @@ const execOnClickOperation = (onClickOperation) => {
         runScript(onClickOperation.args[0])();
     }
 };
+/** @internal */
 const haveFunction = (onClickOperation) => {
     return onClickOperation.operation !== 'none';
 };
@@ -580,6 +683,8 @@ const haveFunction = (onClickOperation) => {
  * @param customAnimationOptions - A custom animation option object
  *
  * @see {@link https://svelte.dev/docs#template-syntax-element-directives-transition-fn-custom-transition-functions| Custom transition functions} for detail documentation
+ *
+ * @internal
  */
 function customAnimation(node, { transform, animationStyle, delay = 0, duration = 1000 }) {
     {
@@ -587,9 +692,11 @@ function customAnimation(node, { transform, animationStyle, delay = 0, duration
     }
 }
 /**
- * {@link loadGlobalScript} load JavaScript that does not support ESM.
+ * ES Modules に対応していない JavaScript をページに読み込む
+ *
+ * @param src - JavaScript ファイルのリンク URL
  *
- * @param src - Link of JavaScript file
+ * @public
  */
 async function loadGlobalScript(src) {
     return new Promise((resolve, reject) => {
@@ -601,9 +708,11 @@ async function loadGlobalScript(src) {
     });
 }
 /**
- * {@link applyGlobalCss} apply global CSS to WEB page.
+ * グローバル CSS をページに適用する
  *
  * @param css - CSS
+ *
+ * @public
  */
 async function applyGlobalCss(css) {
     return new Promise((resolve, reject) => {
@@ -615,9 +724,11 @@ async function applyGlobalCss(css) {
     });
 }
 /**
- * {@link loadGlobalStyle} load global style to WEB page.
+ * style ファイルをページに読み込む
+ *
+ * @param href - style ファイルのリンク URL
  *
- * @param href - Link of style file
+ * @public
  */
 async function loadGlobalStyle(href) {
     return new Promise((resolve, reject) => {
@@ -637,6 +748,8 @@ async function loadGlobalStyle(href) {
  * @returns Hashed string
  *
  * @see https://stackoverflow.com/a/22429679
+ *
+ * @internal
  */
 function hashCode(s) {
     const SEED = 0x41653150;
@@ -653,14 +766,106 @@ function hashCode(s) {
  * @param on - true: auto start, false: not auto start
  *
  * @deprecated 非推奨。`setActionConfig({ autoStart: false })` を使ってください。
+ *
+ * @internal
  */
 const setAutoStart = (on = true) => {
     setStopped();
 };
 
+function doPresent({ direction, deltaRate }, downFn, upFn, condition = false) {
+    if (direction === 'down' && deltaRate > 0) {
+        downFn();
+    }
+    else if (condition && direction === 'up' && deltaRate < 0) {
+        upFn();
+    }
+    return true;
+}
+/**
+ * スクロールに応じてアクションを非表示にするトリガー関数
+ *
+ * @remarks
+ * スクロール率が `hide_on_scroll_rate` に達したときに `hide` 関数を呼び出します。
+ * `show_on_scroll_reenter` が `true` で、かつ `hide_on_scroll_rate` またはその値以下の場合、アクションに対して `show` 関数が呼び出されます。
+ *
+ * @param props - アクションのプロパティ。プロパティには `hide_on_scroll`、`hide_on_scroll_rate` そして `show_on_scroll_reenter` が必要です。
+ * @param hide - アクションを非表示にするロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ * @param show - アクションを再び表示するロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ *
+ * @returns
+ * スクロールが開始された場合は、クリーンアップする関数を返します。そうでない場合は `null` を返します。
+ *
+ * @internal
+ */
+function hideOnScroll(props, hide = NOOP, show = NOOP) {
+    const { hide_on_scroll, hide_on_scroll_rate, show_on_scroll_reenter } = props;
+    return hide_on_scroll && hide_on_scroll_rate
+        ? onScroll(hide_on_scroll_rate / 100, ctx => doPresent(ctx, hide, show, show_on_scroll_reenter))
+        : null;
+}
+/**
+ * 時間に応じてアクションを非表示にするトリガー関数
+ *
+ * @remarks
+ * 時間のカウントが `hide_on_time_count` に達したときに `hide` 関数を呼び出します。
+ *
+ * @param props - アクションのプロパティ。プロパティには `hide_on_time` そして `hide_on_time_count` が必要です。
+ * @param hide - アクションを非表示にするロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ *
+ * @returns
+ * タイマーが開始された場合、タイマーをクリーンアップする関数を返します。それ以外は `null` を返します。
+ *
+ * @internal
+ */
+function hideOnTime(props, hide = NOOP) {
+    return props.hide_on_time && props.hide_on_time_count
+        ? onTime(props.hide_on_time_count * 1000, () => hide())
+        : null;
+}
+/**
+ * スクロールに応じてアクションを表示するトリガー関数
+ *
+ * @remarks
+ * スクロール率が `show_on_scroll_rate` に達したときに `show` 関数を呼び出します。
+ * `hide_on_scroll_releave` が `true` で、かつ `show_on_scroll_rate` 以下の場合は、アクションに対して `hide` 関数が呼び出されます。
+ *
+ * @param props - アクションのプロパティ。プロパティには `show_on_scroll`、`show_on_scroll_rate` そして `hide_on_scroll_releave` が必要です。
+ * @param show - アクションを表示するロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ * @param hide - アクションを非表示にするロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ *
+ * @returns
+ * スクロールが開始されている場合は、クリーンアップ関数を返します。そうでない場合は `null` を返します
+ *
+ * @internal
+ */
+function showOnScroll(props, show = NOOP, hide = NOOP) {
+    const { show_on_scroll, show_on_scroll_rate, hide_on_scroll_releave } = props;
+    return show_on_scroll && show_on_scroll_rate
+        ? onScroll(show_on_scroll_rate / 100, ctx => doPresent(ctx, show, hide, hide_on_scroll_releave))
+        : null;
+}
 /**
+ * 時間に応じてアクションを表示するトリガー関数
+ *
+ * @param props - アクションのプロパティ。プロパティには `show_on_time` そして `show_on_time_count` が必要です。
+ * @param show - アクションを表示するロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ *
+ * @remarks
+ * 時間のカウントが `show_on_time_count` に達したときに `show` 関数を呼び出します。
+ *
+ * @returns
+ * タイマーが開始された場合、タイマーをクリーンアップする関数を返します。それ以外は `null` を返します。
+ *
  * @internal
  */
+function showOnTime(props, show = NOOP) {
+    return props.show_on_time && props.show_on_time_count
+        ? onTime(props.show_on_time_count * 1000, () => show())
+        : null;
+}
+
+/** @internal */
 const PropTypes = [
     'BooleanKeyword',
     'NumberKeyword',
@@ -682,21 +887,15 @@ const PropTypes = [
     'ModalPlacement',
     'OnClick',
 ];
-/**
- * @internal
- */
+/** @internal */
 const MediaQueries = {
     PC: '(\\s*min-width\\s*:\\s*1025px\\s*)',
     Tablet: '(\\s*min-width\\s*:\\s*897px)\\s+and\\s+(\\s*max-width\\s*:\\s*1024px\\s*)',
     Mobile: '(\\s*max-width\\s*:\\s*896px\\s*)',
 };
-/**
- * @internal
- */
+/** @internal */
 const Directions = ['row', 'column'];
-/**
- * @internal
- */
+/** @internal */
 const AnimationStyles = [
     'none',
     'fade',
@@ -706,9 +905,7 @@ const AnimationStyles = [
     'slide-left',
     'slide-right',
 ];
-/**
- * @internal
- */
+/** @internal */
 const ModalPositions = [
     'top-left',
     'top-center',
@@ -721,9 +918,7 @@ const ModalPositions = [
     'bottom-right',
     'none',
 ];
-/**
- * @internal
- */
+/** @internal */
 const DefaultModalPlacement = {
     position: 'center',
     margin: {
@@ -735,25 +930,17 @@ const DefaultModalPlacement = {
     backgroundOverlay: false,
     backgroundClick: { operation: 'closeApp', args: ['overlay'] },
 };
-/**
- * @internal
- */
+/** @internal */
 const Elasticities = ['none', 'vertical', 'horizontal'];
-/**
- * @internal
- */
+/** @internal */
 const ElasticityStyle = {
     none: '',
     vertical: 'height: 100%',
     horizontal: 'width: 100%',
 };
-/**
- * @internal
- */
+/** @internal */
 const TextDirections = ['horizontal', 'vertical'];
-/**
- * @internal
- */
+/** @internal */
 const OnClickOperationOptions = [
     {
         operation: 'none',
@@ -800,9 +987,7 @@ const OnClickOperationOptions = [
         ],
     },
 ];
-/**
- * @internal
- */
+/** @internal */
 const FormOperationOptions = [
     {
         operation: 'submit',
@@ -832,101 +1017,61 @@ const FormOperationOptions = [
         ],
     },
 ];
-/**
- * @internal
- */
+/** @internal */
 const LengthUnits = ['px', 'em', 'rem', 'vw', 'fr', '%'];
-/**
- * @internal
- */
+/** @internal */
 const Justifies = ['flex-start', 'center', 'flex-end'];
-/**
- * @internal
- */
+/** @internal */
 const Alignments = ['flex-start', 'center', 'flex-end'];
-/**
- * @internal
- */
+/** @internal */
 const ObjectFits = ['fill', 'contain', 'cover'];
-/**
- * @internal
- */
+/** @internal */
 const ClipPaths = ['none', 'circle(closest-side)'];
-/**
- * @internal
- */
+/** @internal */
 const Repeats = ['repeat', 'space', 'round', 'no-repeat'];
-/**
- * @internal
- */
+/** @internal */
 const BackgroundSizes = ['cover', 'contain', 'auto'];
-/**
- * @internal
- */
+/** @internal */
 const Cursors = ['default', 'pointer'];
-/**
- * @internal
- */
+/** @internal */
 const Overflows = ['visible', 'auto', 'hidden'];
-/**
- * @internal
- */
+/** @internal */
 const WritingModes = ['horizontal-tb', 'vertical-lr'];
-/**
- * @internal
- */
+/** @internal */
 const ListSeparatorTypes = ['none', 'border', 'gap'];
-/**
- * @internal
- */
+/** @internal */
 const DefaultListSeparatorNone = {
     type: 'none',
 };
-/**
- * @internal
- */
+/** @internal */
 const DefaultListSeparatorBorder = {
     type: 'border',
     borderStyle: 'solid',
     borderWidth: '1px',
     borderColor: 'rgba(0, 0, 0, 0.06)',
 };
-/**
- * @internal
- */
+/** @internal */
 const DefaultListSeparatorGap = {
     type: 'gap',
     gap: '8px',
 };
-/**
- * @internal
- */
+/** @internal */
 const DefaultListSeparator = DefaultListSeparatorBorder;
-/**
- * @internal
- */
+/** @internal */
 const ListBackgroundTypes = ['none', 'stripe'];
-/**
- * @internal
- */
+/** @internal */
 const DefaultListBackgroundNone = {
     type: 'none',
 };
-/**
- * @internal
- */
+/** @internal */
 const DefaultListBackgroundStripe = {
     type: 'stripe',
     background1: 'rgba(0, 0, 0, 0.06)',
     background2: '#fff',
 };
-/**
- * @internal
- */
+/** @internal */
 const DefaultListBackground = DefaultListBackgroundNone;
-/**
- * @internal
- */
+/** @internal */
 const ListDirections = ['vertical', 'horizontal'];
 const DefaultSliderButton = {
     type: 'icon',
@@ -942,97 +1087,88 @@ const DefaultSliderNavigationButton = {
     colorActive: '#666',
 };
 
-function doPresent({ direction, deltaRate }, downFn, upFn, condition = false) {
-    if (direction === 'down' && deltaRate > 0) {
-        downFn();
-    }
-    else if (condition && direction === 'up' && deltaRate < 0) {
-        upFn();
+/**
+ * アクションが作成 (create) される前にフックする関数
+ *
+ * @param fn - 呼び出されるフック関数
+ *
+ * @public
+ */
+function onCreate(fn) {
+    let { onCreateHandlers } = getInternalHandlers();
+    if (!onCreateHandlers) {
+        onCreateHandlers = [];
     }
-    return true;
+    onCreateHandlers.push(fn);
+    updateInternalHandlers({ onCreateHandlers });
 }
 /**
- * スクロールに応じてアクションを非表示にするトリガー関数
+ * アクションが表示 (show) された後にフックする関数
  *
- * @remarks
- * スクロール率が `hide_on_scroll_rate` に達したときに `hide` 関数を呼び出します。
- * `show_on_scroll_reenter` が `true` で、かつ `hide_on_scroll_rate` またはその値以下の場合、アクションに対して `show` 関数が呼び出されます。
- *
- * @param props - アクションのプロパティ。プロパティには `hide_on_scroll`、`hide_on_scroll_rate` そして `show_on_scroll_reenter` が必要です。
- * @param hide - アクションを非表示にするロジックが実装された関数。指定ない場合は noop 関数が使用されます。
- * @param show - アクションを再び表示するロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ * @param fn - 呼び出されるフック関数
  *
- * @returns
- * スクロールが開始された場合は、クリーンアップする関数を返します。そうでない場合は `null` を返します。
+ * @public
  */
-function hideOnScroll(props, hide = NOOP, show = NOOP) {
-    const { hide_on_scroll, hide_on_scroll_rate, show_on_scroll_reenter } = props;
-    return hide_on_scroll && hide_on_scroll_rate
-        ? onScroll(hide_on_scroll_rate / 100, ctx => doPresent(ctx, hide, show, show_on_scroll_reenter))
-        : null;
+function onShow(fn) {
+    let { onShowHandlers } = getInternalHandlers();
+    if (!onShowHandlers) {
+        onShowHandlers = [];
+    }
+    onShowHandlers.push(fn);
+    updateInternalHandlers({ onShowHandlers });
 }
 /**
- * 時間に応じてアクションを非表示にするトリガー関数
- *
- * @remarks
- * 時間のカウントが `hide_on_time_count` に達したときに `hide` 関数を呼び出します。
+ * アクションがクローズ (close) される前にフックする関数
  *
- * @param props - アクションのプロパティ。プロパティには `hide_on_time` そして `hide_on_time_count` が必要です。
- * @param hide - アクションを非表示にするロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ * @param fn - 呼び出されるフック関数
  *
- * @returns
- * タイマーが開始された場合、タイマーをクリーンアップする関数を返します。それ以外は `null` を返します。
+ * @public
  */
-function hideOnTime(props, hide = NOOP) {
-    return props.hide_on_time && props.hide_on_time_count
-        ? onTime(props.hide_on_time_count * 1000, () => hide())
-        : null;
+function onClose(fn) {
+    let { onCloseHandlers } = getInternalHandlers();
+    if (!onCloseHandlers) {
+        onCloseHandlers = [];
+    }
+    onCloseHandlers.push(fn);
+    updateInternalHandlers({ onCloseHandlers });
 }
 /**
- * スクロールに応じてアクションを表示するトリガー関数
- *
- * @remarks
- * スクロール率が `show_on_scroll_rate` に達したときに `show` 関数を呼び出します。
- * `hide_on_scroll_releave` が `true` で、かつ `show_on_scroll_rate` 以下の場合は、アクションに対して `hide` 関数が呼び出されます。
+ * アクションが破棄 (destroy) される前にフックする関数
  *
- * @param props - アクションのプロパティ。プロパティには `show_on_scroll`、`show_on_scroll_rate` そして `hide_on_scroll_releave` が必要です。
- * @param show - アクションを表示するロジックが実装された関数。指定ない場合は noop 関数が使用されます。
- * @param hide - アクションを非表示にするロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ * @param fn - 呼び出されるフック関数
  *
- * @returns
- * スクロールが開始されている場合は、クリーンアップ関数を返します。そうでない場合は `null` を返します
+ * @public
  */
-function showOnScroll(props, show = NOOP, hide = NOOP) {
-    const { show_on_scroll, show_on_scroll_rate, hide_on_scroll_releave } = props;
-    return show_on_scroll && show_on_scroll_rate
-        ? onScroll(show_on_scroll_rate / 100, ctx => doPresent(ctx, show, hide, hide_on_scroll_releave))
-        : null;
+function onDestroy(fn) {
+    let { onDestoryHandlers } = getInternalHandlers();
+    if (!onDestoryHandlers) {
+        onDestoryHandlers = [];
+    }
+    onDestoryHandlers.push(fn);
+    updateInternalHandlers({ onDestoryHandlers });
 }
 /**
- * 時間に応じてアクションを表示するトリガー関数
- *
- * @param props - アクションのプロパティ。プロパティには `show_on_time` そして `show_on_time_count` が必要です。
- * @param show - アクションを表示するロジックが実装された関数。指定ない場合は noop 関数が使用されます。
+ * アクションのステートが変更された (changeState) 後にフックする関数
  *
- * @remarks
- * 時間のカウントが `show_on_time_count` に達したときに `show` 関数を呼び出します。
+ * @param fn - 呼び出されるフック関数
  *
- * @returns
- * タイマーが開始された場合、タイマーをクリーンアップする関数を返します。それ以外は `null` を返します。
+ * @public
  */
-function showOnTime(props, show = NOOP) {
-    return props.show_on_time && props.show_on_time_count
-        ? onTime(props.show_on_time_count * 1000, () => show())
-        : null;
+function onChangeState(fn) {
+    let { onChangeStateHandlers } = getInternalHandlers();
+    if (!onChangeStateHandlers) {
+        onChangeStateHandlers = [];
+    }
+    onChangeStateHandlers.push(fn);
+    updateInternalHandlers({ onChangeStateHandlers });
 }
-
 /**
- * KARTE アクションを作成する
+ * アクションを作成する
  *
  * @param App - Svelte コンポーネントのエントリポイント
  * @param options - {@link ActionOptions | オプション}
  *
- * @returns KARTE アクションを破棄する関数
+ * @returns アクションを破棄する関数
  *
  * @public
  */
@@ -1173,29 +1309,41 @@ function dispatchDestroyEvent() {
     window.dispatchEvent(event);
 }
 /**
- * Destory KARTE action
+ * アクションの破棄する
+ *
+ * @public
  */
 function destroy() {
     setDestroyed(true);
     dispatchDestroyEvent();
 }
 /**
- * Show KARTE action
+ * アクションを表示する
+ *
+ * @public
  */
 function showAction() {
     const event = new CustomEvent(ACTION_SHOW_EVENT);
     window.dispatchEvent(event);
 }
 /**
- * Close KARTE action
+ * アクションを閉じる
+ *
+ * @param trigger - 閉じた時のトリガー。デフォルト `'none'`
+ *
+ * @public
  */
 function closeAction(trigger = 'none') {
     const event = new CustomEvent(ACTION_CLOSE_EVENT, { detail: { trigger } });
     window.dispatchEvent(event);
 }
+/** @internal */
 const KARTE_ACTION_ROOT = 'karte-action-root';
+/** @internal */
 const KARTE_ACTION_RID = 'karte-action-rid';
+/** @internal */
 const KARTE_ACTION_SHORTEN_ID = 'karte-action-id';
+/** @internal */
 function ensureActionRoot(useShadow = true) {
     const systemConfig = getSystem();
     const rootAttrs = {
@@ -1218,81 +1366,7 @@ function ensureActionRoot(useShadow = true) {
         return el;
     }
 }
-/**
- * アクションが作成 (create) される前にフックする
- *
- * @param fn - 呼び出されるフック関数
- *
- * @public
- */
-function onCreate(fn) {
-    let { onCreateHandlers } = getInternalHandlers();
-    if (!onCreateHandlers) {
-        onCreateHandlers = [];
-    }
-    onCreateHandlers.push(fn);
-    updateInternalHandlers({ onCreateHandlers });
-}
-/**
- * アクションが表示 (show) された後にフックする
- *
- * @param fn - 呼び出されるフック関数
- *
- * @public
- */
-function onShow(fn) {
-    let { onShowHandlers } = getInternalHandlers();
-    if (!onShowHandlers) {
-        onShowHandlers = [];
-    }
-    onShowHandlers.push(fn);
-    updateInternalHandlers({ onShowHandlers });
-}
-/**
- * アクションがクローズ (close) される前にフックする
- *
- * @param fn - 呼び出されるフック関数
- *
- * @public
- */
-function onClose(fn) {
-    let { onCloseHandlers } = getInternalHandlers();
-    if (!onCloseHandlers) {
-        onCloseHandlers = [];
-    }
-    onCloseHandlers.push(fn);
-    updateInternalHandlers({ onCloseHandlers });
-}
-/**
- * アクションが破棄 (destroy) される前にフックする
- *
- * @param fn - 呼び出されるフック関数
- *
- * @public
- */
-function onDestroy(fn) {
-    let { onDestoryHandlers } = getInternalHandlers();
-    if (!onDestoryHandlers) {
-        onDestoryHandlers = [];
-    }
-    onDestoryHandlers.push(fn);
-    updateInternalHandlers({ onDestoryHandlers });
-}
-/**
- * アクションのステートが変更された (changeState) 後にフックする
- *
- * @param fn - 呼び出されるフック関数
- *
- * @public
- */
-function onChangeState(fn) {
-    let { onChangeStateHandlers } = getInternalHandlers();
-    if (!onChangeStateHandlers) {
-        onChangeStateHandlers = [];
-    }
-    onChangeStateHandlers.push(fn);
-    updateInternalHandlers({ onChangeStateHandlers });
-}
+/** @internal */
 const h = (type, props, ...children) => {
     const el = document.createElement(type);
     for (const key of Object.keys(props)) {
@@ -1313,6 +1387,8 @@ const h = (type, props, ...children) => {
  * create a fog element
  *
  * @deprecated 非推奨
+ *
+ * @internal
  */
 function createFog({ color = '#000', opacity = '50%', zIndex = 999, onclick, }) {
     const root = ensureModalRoot(false);
@@ -1339,25 +1415,14 @@ function createFog({ color = '#000', opacity = '50%', zIndex = 999, onclick, })
     root.appendChild(fog);
     return { fog, close };
 }
-function embed(target, replace, embed_method) {
-    if (embed_method == 'replace') {
-        if (target.parentNode) {
-            target.parentNode.replaceChild(replace, target);
-        }
-    }
-    else if (embed_method == 'append') {
-        target.append(replace);
-    }
-    else if (embed_method == 'prepend') {
-        target.prepend(replace);
-    }
-    else if (embed_method == 'after') {
-        target.after(replace);
-    }
-    else if (embed_method == 'before') {
-        target.before(replace);
-    }
-}
+/**
+ * アクションの Shadow Root の Element を取得する
+ *
+ * @returns
+ * アクションが Shadow Root を持つ場合は Shadow Root の Element 返します。ない場合は `null` を返します
+ *
+ * @public
+ */
 function getActionShadowRoot() {
     const root = document.querySelector(`.${KARTE_ACTION_ROOT}[data-${KARTE_ACTION_RID}='${actionId}']`);
     if (!root || !root.shadowRoot) {
@@ -1366,11 +1431,13 @@ function getActionShadowRoot() {
     return root.shadowRoot;
 }
 /**
- * KARTE アクションに CSS を適用する
+ * アクションに CSS を適用する
  *
  * @param css - 適用する CSS
  *
  * @returns 適用された style 要素を返す Promise
+ *
+ * @public
  */
 async function applyCss(css) {
     return new Promise((resolve, reject) => {
@@ -1408,9 +1475,11 @@ async function fixFontFaceIssue(href, cssRules) {
     return [rules.join('\n'), fixedRules.join('\n')];
 }
 /**
- * KARTE アクションにグローバルなスタイルをロードする
+ * アクションにグローバルなスタイルを読み込む
+ *
+ * @param href - style ファイルのリンク URL
  *
- * @param href - style ファイルのリンク先 URL
+ * @public
  */
 async function loadStyle(href) {
     const sr = getActionShadowRoot();
@@ -1443,11 +1512,46 @@ async function loadStyle(href) {
     document.adoptedStyleSheets = [...document.adoptedStyleSheets, css, fontFaceCss];
 }
 // -------- The following codes are deprecated --------
-const showModal = create; // @deprecated
-const KARTE_MODAL_ROOT = 'karte-modal-root'; // @deprecated
-const ensureModalRoot = ensureActionRoot; // @deprecated
-const show = showAction; // deprecated
-const close = closeAction; // deprecated
+/**
+ * 非推奨です
+ *
+ * @deprecated 非推奨
+ *
+ * @internal
+ */
+const showModal = create;
+/**
+ * 非推奨です
+ *
+ * @deprecated 非推奨
+ *
+ * @internal
+ */
+const KARTE_MODAL_ROOT = 'karte-modal-root';
+/**
+ * 非推奨です
+ *
+ * @deprecated 非推奨
+ *
+ * @internal
+ */
+const ensureModalRoot = ensureActionRoot;
+/**
+ * 非推奨です
+ *
+ * @deprecated 非推奨
+ *
+ * @internal
+ */
+const show = showAction;
+/**
+ * 非推奨です
+ *
+ * @deprecated 非推奨
+ *
+ * @internal
+ */
+const close = closeAction;
 /**
  * Create an application instance
  *
@@ -1457,6 +1561,8 @@ const close = closeAction; // deprecated
  * @returns A function to close the modal
  *
  * @deprecated 非推奨
+ *
+ * @internal
  */
 function createApp(App, options = {
     send: () => { },
@@ -1498,7 +1604,16 @@ function createApp(App, options = {
     };
 }
 
-const collection$1 = (config) => {
+/**
+ * アクションテーブルを管理するメソッドを取得する
+ *
+ * @param config - 設定情報
+ *
+ * @returns メソッドを返します
+ *
+ * @public
+ */
+function collection$1(config) {
     const endpoint = config.endpoint || "https://t.karte.test/collection";
     const api_key = config.api_key;
     const table = config.table;
@@ -1537,7 +1652,7 @@ const collection$1 = (config) => {
             }, cb);
         },
     };
-};
+}
 function request(url, data, cb) {
     const xhr = new XMLHttpRequest();
     xhr.onreadystatechange = () => {
@@ -5006,6 +5121,7 @@ class MovieVimeoElement extends SvelteComponent {
 	}
 }
 
+/** @internal */
 function registerInput({ name, statePath, validator = () => true, initialValue, }) {
     const writableValue = {
         subscribe(run) {
@@ -5040,6 +5156,7 @@ function registerInput({ name, statePath, validator = () => true, initialValue,
     writableValue.set(initialValue);
     return writableValue;
 }
+/** @internal */
 function deleteValues(statePath) {
     formData.update(prev => {
         const targetNames = Object.entries(prev)
@@ -5051,6 +5168,7 @@ function deleteValues(statePath) {
         return { ...prev };
     });
 }
+/** @internal */
 const getValuesAreValidReader = statePath => ({
     subscribe(callback) {
         return formData.subscribe(formData => {
@@ -5086,6 +5204,7 @@ function formDataToEventValues(campaignId, formData) {
         },
     };
 }
+/** @internal */
 function submit() {
     const systemConfig = getSystem();
     const campaignId = systemConfig.campaignId;
@@ -7303,4 +7422,4 @@ class ImageBlock extends SvelteComponent {
 	}
 }
 
-export { ACTION_CHANGE_STATE_EVENT, ACTION_CLOSE_EVENT, ACTION_DESTROY_EVENT, ACTION_SHOW_EVENT, ALL_ACTION_ID, ALL_ACTION_SHORTEN_ID, Alignments, AnimationStyles, BackgroundSizes, ClipPaths, Cursors, DefaultListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListSeparator, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparatorNone, DefaultModalPlacement, DefaultSliderButton, DefaultSliderNavigationButton, Directions, Elasticities, ElasticityStyle, EmbedElement, Flex, FlexItem, FormButton, FormCheckBoxes, FormOperationOptions, FormRadioButtons, FormSelect, FormTextarea, Grid, GridItem, GridModalState, ImageBlock, ImageElement, Justifies, KARTE_ACTION_RID, KARTE_ACTION_ROOT, KARTE_ACTION_SHORTEN_ID, KARTE_MODAL_ROOT, LengthUnits, List, ListBackgroundTypes, ListDirections, ListItem, ListSeparatorTypes, MediaQueries, Modal, ModalPositions, MovieVimeoElement, MovieYouTubeElement, NOOP, ObjectFits, OnClickOperationOptions, Overflows, PropTypes, Repeats, Slider, SliderItem, State, StateItem, TextBlock, TextButtonBlock, TextButtonElement, TextDirections, TextElement, WritingModes, actionId, actionSetting, addState, applyCss, applyGlobalCss, close, closeAction, closeApp, closed, collection$1 as collection, create, createApp, createFog, customAnimation, customHandlers, customVariables, destroy, destroyed, dispatchDestroyEvent, embed, ensureActionRoot, ensureModalRoot, execOnClickOperation, finalize, formData, getActionSetting, getActionShadowRoot, getCustomHandlers, getCustomVariables, getInternalHandlers, getMarginStyle, getPositionStyle, getState$1 as getState, getStates, getStoreState, getSystem, getTransform, h, handleFocus, handleKeydown, handleState, hasSuffix, hashCode, haveFunction, hideOnScroll, hideOnTime, initialize, internalHandlers, isClosed, isDestroyed, isOpened, isPreview, isStopped, linkTo, loadGlobalScript, loadGlobalStyle, loadStyle, maximumZindex, moveTo, none, onChangeState, onClose, onCreate, onDestroy, onScroll, onShow, onTime, opened, randStr, resetActionSetting, runScript, send_event, setActionSetting, setAutoStart, setClosed, setCustomHandlers, setCustomVariables, setDestroyed, setInternalHandlers, setMaximumZindex, setOpened, setPreviousFocus, setState$1 as setState, setStopped, setSystem, show, showAction, showModal, showOnScroll, showOnTime, state, states, stopped, system, toBr, updateCustomHandlers, updateCustomVariables, updateInternalHandlers, widget };
+export { Alignments, AnimationStyles, BackgroundSizes, ClipPaths, Cursors, DefaultListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListSeparator, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparatorNone, DefaultModalPlacement, DefaultSliderButton, DefaultSliderNavigationButton, Directions, Elasticities, ElasticityStyle, EmbedElement, Flex, FlexItem, FormButton, FormCheckBoxes, FormOperationOptions, FormRadioButtons, FormSelect, FormTextarea, Grid, GridItem, GridModalState, ImageBlock, ImageElement, Justifies, KARTE_MODAL_ROOT, LengthUnits, List, ListBackgroundTypes, ListDirections, ListItem, ListSeparatorTypes, MediaQueries, Modal, ModalPositions, MovieVimeoElement, MovieYouTubeElement, ObjectFits, OnClickOperationOptions, Overflows, PropTypes, Repeats, Slider, SliderItem, State, StateItem, TextBlock, TextButtonBlock, TextButtonElement, TextDirections, TextElement, WritingModes, applyCss, applyGlobalCss, close, closeAction, closed, collection$1 as collection, create, createApp, createFog, customHandlers, customVariables, destroy, destroyed, ensureModalRoot, finalize, formData, getActionShadowRoot, getCustomHandlers, getCustomVariables, getState$1 as getState, getStates, getStoreState, getSystem, hideOnScroll, hideOnTime, initialize, isClosed, isOpened, loadGlobalScript, loadGlobalStyle, loadStyle, onChangeState, onClose, onCreate, onDestroy, onScroll, onShow, onTime, opened, setActionSetting, setAutoStart, setClosed, setCustomHandlers, setCustomVariables, setState$1 as setState, show, showAction, showModal, showOnScroll, showOnTime, state, stopped, updateCustomHandlers, updateCustomVariables, widget };