@plaidev/karte-action-sdk 1.1.124 → 1.1.125-27947768.57120ff7

package/dist/hydrate/index.es.js

@@ -6,10 +6,6 @@ import { setContext, getContext, createEventDispatcher, onMount, onDestroy as on
 /** @internal */
 const NOOP = (_args) => { }; // eslint-disable-line @typescript-eslint/no-unused-vars
 /** @internal */
-const isPreview = () => {
-    return true;
-};
-/** @internal */
 const handleFocus = (node) => (e) => {
     if (node) {
         // trap focus
@@ -288,12 +284,12 @@ const state = writable('/');
  * 現在のステートを設定する
  *
  * @param stateId - 表示するステートID
- * @param force - 強制的にステートを設定するフラグ。デフォルトは `false`
+ * @param options - オプション。`options.disableInPreview`でプレビュー時のステート遷移を無効化できます。
  *
  * @public
  */
-function setState$1(stateId, force = false) {
-    if (!force && isPreview())
+function setState$1(stateId, options) {
+    if (options?.disableInPreview)
         return;
     state.set(stateId);
 }
@@ -703,15 +699,14 @@ 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);
+        setState$1(event.detail.to, { disableInPreview: event.detail.disableInPreview });
     }
 };
 /** @internal */
 const initialize = (setting) => {
     const newSetting = setActionSetting(setting);
     if (newSetting.initialState) {
-        const force = true;
-        setState$1(setting?.initialState, force);
+        setState$1(setting?.initialState);
     }
     if (newSetting.autoStart) {
         setStopped(!newSetting.autoStart);
@@ -928,24 +923,27 @@ function w(w) {
  */
 const logger = {
     info: (...messages) => {
-        const log = { level: 'info', message: formatLog(messages), date: new Date() };
+        const log = { level: 'info', messages, date: new Date() };
         w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'log', log } }, '*');
     },
     log: (...messages) => {
-        const log = { level: 'info', message: formatLog(messages), date: new Date() };
+        const log = { level: 'info', messages, date: new Date() };
         w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'log', log } }, '*');
     },
     error: (...messages) => {
-        const log = { level: 'error', message: formatLog(messages), date: new Date() };
+        const log = { level: 'error', messages, date: new Date() };
         w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'log', log } }, '*');
     },
     warn: (...messages) => {
-        const log = { level: 'warn', message: formatLog(messages), date: new Date() };
+        const log = { level: 'warn', messages, date: new Date() };
         w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'log', log } }, '*');
     },
     event: (name, values) => {
         const event = values ? { name, values, date: new Date() } : { name, date: new Date() };
-        w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'event', event } }, '*');
+        w(window).postMessage({
+            type: 'KARTE-ACTION-LOGGER',
+            detail: { method: 'event', event, values: values },
+        }, '*');
     },
     clear: () => {
         w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'clear' } }, '*');
@@ -955,7 +953,7 @@ const logger = {
     },
 };
 /**
- * loggerのログを実行ログに表示する
+ * メッセージを実行ログに表示する
  */
 function listenLogger() {
     const handler = (event) => {
@@ -976,8 +974,8 @@ function listenLogger() {
             if (MESSAGES_LIMIT <= logs.length) {
                 logs.shift();
             }
-            const { level, message } = detail.log;
-            const log = { level, message, date: new Date() };
+            const { level, messages } = detail.log;
+            const log = { level, messages, date: new Date() };
             logs.push(log);
         }
         else if (detail.method === 'event') {
@@ -1026,39 +1024,6 @@ function listenConsoleLogger() {
         console.warn = warn;
     };
 }
-function formatLog(texts) {
-    if (!texts)
-        return '';
-    const s = texts
-        .reduce((acc, t) => {
-        let text = '';
-        try {
-            if (typeof t === 'string') {
-                text += t;
-            }
-            else if (t instanceof Error) {
-                text += formatError(t);
-            }
-            else {
-                text += JSON.stringify(t, undefined, 2);
-            }
-        }
-        catch (e) {
-            //pass
-        }
-        acc += text + ' ';
-        return acc;
-    }, '')
-        .trim();
-    return s.length > 3000 ? s.substr(0, 3000) + '...' : s;
-}
-function formatError(error) {
-    if (!error)
-        return '';
-    if (error.stack)
-        return error.stack;
-    return error.message;
-}
 
 function doPresent({ direction, deltaRate }, downFn, upFn, condition = false) {
     if (direction === 'down' && deltaRate > 0) {
@@ -1388,6 +1353,90 @@ const FormRatingButtonTypes = ['star', 'face'];
 /** @internal */
 const DefaultFormRatingButtonType = 'star';
 
+const DEFAULT_COLLECTION_ENDPOINT = typeof __FLYER_GEN_COLLECTION_API_ENDPOINT__ === 'string'
+    ? __FLYER_GEN_COLLECTION_API_ENDPOINT__
+    : 'https://t.karte.io/collection';
+/**
+ * アクションテーブルを管理するメソッドを取得する
+ *
+ * @param config - 設定情報
+ *
+ * @returns メソッドを返します
+ *
+ * @public
+ */
+function collection$1(config) {
+    const endpoint = config.endpoint || DEFAULT_COLLECTION_ENDPOINT;
+    const api_key = config.api_key;
+    const table = config.table;
+    return {
+        get(key, cb) {
+            if (Array.isArray(key)) {
+                return request(`${endpoint}/getByKeys`, {
+                    api_key,
+                    name: table,
+                    keys: key,
+                }, cb);
+            }
+            else {
+                request(`${endpoint}/getByKey`, {
+                    api_key,
+                    name: table,
+                    key,
+                }, cb);
+            }
+        },
+        getByQuery(query_name, params, options, cb) {
+            request(`${endpoint}/getByQuery`, {
+                api_key,
+                name: table,
+                query_name,
+                params,
+                options,
+            }, cb);
+        },
+        set(key, value, cb) {
+            request(`${endpoint}/set`, {
+                api_key,
+                name: table,
+                key,
+                value,
+            }, cb);
+        },
+    };
+}
+function request(url, data, cb) {
+    fetch(url, {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'text/plain;charset=UTF-8',
+        },
+        body: JSON.stringify({ ...data }),
+    }).then(response => {
+        if (!response.ok) {
+            return cb(new Error(`fail to request collection api. reason: ${response.status}`));
+        }
+        return cb(null, response.json());
+    });
+}
+const loadActionTableRow = async (config, api_key, endpoint) => {
+    return new Promise((resolve, reject) => collection$1({ endpoint, api_key, table: config.default.table_name }).get(config.default.key, (err, data) => (err ? reject(err) : resolve(data))));
+};
+const loadActionTableRows = async (config, api_key, endpoint) => {
+    return new Promise((resolve, reject) => collection$1({ endpoint, api_key, table: config.default.table_name }).get(config.default.key, (err, data) => (err ? reject(err) : resolve(data))));
+};
+const loadActionTableQuery = async (config, api_key, endpoint) => {
+    return new Promise((resolve, reject) => collection$1({ endpoint, api_key, table: config.default.table_name }).getByQuery(config.default.query_name, config.default.params, null, (err, data) => (err ? reject(err) : resolve(data))));
+};
+const loadActionTable = async (config, api_key, endpoint) => {
+    const results = config.map(c => c.preview_value)
+        ;
+    return config.reduce((acc, c, i) => {
+        acc[c.name] = results[i];
+        return acc;
+    }, {});
+};
+
 /**
  * アクションが作成 (create) される前にフックする関数
  *
@@ -1477,6 +1526,7 @@ function create(App, options = {
     send: () => { },
     props: {},
     variables: {},
+    localVariablesQuery: undefined,
 }) {
     let app = null;
     const data = {
@@ -1489,7 +1539,7 @@ function create(App, options = {
     // NOTE: onCreateより前にListenする必要がある
     window.addEventListener(ACTION_DESTROY_EVENT, () => {
         const { onDestroyHandlers } = getInternalHandlers();
-        onDestroyHandlers && onDestroyHandlers.forEach(h => h(actionProps));
+        onDestroyHandlers?.forEach(h => h(actionProps));
         // 複数回onDestroyを呼ばないようにする処理
         window.removeEventListener('beforeunload', dispatchDestroyEvent);
     });
@@ -1500,6 +1550,10 @@ function create(App, options = {
         shortenId: data.shorten_id || null,
         campaignId: data.campaign_id || null,
     });
+    // ActionTable APIへの非同期リクエスト
+    if (options.localVariablesQuery && data.api_key) {
+        loadActionTable(options.localVariablesQuery, data.api_key).then(result => setCustomVariables(result));
+    }
     const close = (trigger = 'none') => {
         if (!app) {
             return;
@@ -1728,7 +1782,7 @@ function createFog({ color = '#000', opacity = '50%', zIndex = 999, onclick, })
  */
 function getActionShadowRoot() {
     const root = document.querySelector(`.${KARTE_ACTION_ROOT}[data-${KARTE_ACTION_RID}='${actionId}']`);
-    if (!root || !root.shadowRoot) {
+    if (!root?.shadowRoot) {
         return null;
     }
     return root.shadowRoot;
@@ -1761,7 +1815,7 @@ async function fixFontFaceIssue(href, cssRules) {
     const rules = [];
     const fixedRules = [];
     Array.from(css.cssRules).forEach(cssRule => {
-        if (cssRule.type != 5) {
+        if (cssRule.type !== 5) {
             rules.push(cssRule.cssText);
         }
         // type 5 is @font-face
@@ -1871,6 +1925,7 @@ function createApp(App, options = {
     send: () => { },
     props: {},
     variables: {},
+    localVariablesQuery: undefined,
 }) {
     let app = null;
     const close = () => {
@@ -1907,80 +1962,6 @@ function createApp(App, options = {
     };
 }
 
-const DEFAULT_COLLECTION_ENDPOINT = typeof __FLYER_GEN_COLLECTION_API_ENDPOINT__ === 'string'
-    ? __FLYER_GEN_COLLECTION_API_ENDPOINT__
-    : 'https://t.karte.io/collection';
-/**
- * アクションテーブルを管理するメソッドを取得する
- *
- * @param config - 設定情報
- *
- * @returns メソッドを返します
- *
- * @public
- */
-function collection$1(config) {
-    const endpoint = config.endpoint || DEFAULT_COLLECTION_ENDPOINT;
-    const api_key = config.api_key;
-    const table = config.table;
-    return {
-        get(key, cb) {
-            if (Array.isArray(key)) {
-                return request(`${endpoint}/getByKeys`, {
-                    api_key,
-                    name: table,
-                    keys: key,
-                }, cb);
-            }
-            else {
-                request(`${endpoint}/getByKey`, {
-                    api_key,
-                    name: table,
-                    key,
-                }, cb);
-            }
-        },
-        getByQuery(query_name, params, options, cb) {
-            request(`${endpoint}/getByQuery`, {
-                api_key,
-                name: table,
-                query_name,
-                params,
-                options,
-            }, cb);
-        },
-        set(key, value, cb) {
-            request(`${endpoint}/set`, {
-                api_key,
-                name: table,
-                key,
-                value,
-            }, cb);
-        },
-    };
-}
-function request(url, data, cb) {
-    const xhr = new XMLHttpRequest();
-    xhr.onreadystatechange = () => {
-        if (xhr.readyState != 4) {
-            return;
-        }
-        if (xhr.status != 200) {
-            return cb(new Error(`fail to send collection api request. reason: ${xhr.responseText}`));
-        }
-        try {
-            data = JSON.parse(xhr.responseText);
-            return cb(null, data);
-        }
-        catch (err) {
-            return cb(err);
-        }
-    };
-    xhr.open('POST', url);
-    xhr.setRequestHeader('Content-Type', 'text/plain;charset=UTF-8');
-    xhr.send(JSON.stringify({ ...data }));
-}
-
 /**
  * Widget API 互換のインターフェース
  */
@@ -8394,4 +8375,4 @@ class ImageBlock extends SvelteComponent {
 	}
 }
 
-export { Alignments, AnimationStyles, BackgroundSizes, ClipPaths, Cursors, DefaultFormButtonStyle, DefaultFormRatingButtonType, DefaultFormSelectStyle, DefaultListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListSeparator, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparatorNone, DefaultModalPlacement, DefaultSlideButton, DefaultSlideNavigationButton, Directions, Elasticities, ElasticityStyle, EmbedElement, Flex, FlexItem, FormCheckBoxes, FormRadioButtons, FormRatingButtonTypes, FormRatingButtons, 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, Slide, SlideItem, 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, getEvents, getLogs, getState$1 as getState, getStates, getStoreState, getSystem, hideOnScroll, hideOnTime, initialize, isClosed, isOpened, listenConsoleLogger, listenLogger, loadGlobalScript, loadGlobalStyle, loadStyle, logger, 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 };
+export { Alignments, AnimationStyles, BackgroundSizes, ClipPaths, Cursors, DefaultFormButtonStyle, DefaultFormRatingButtonType, DefaultFormSelectStyle, DefaultListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListSeparator, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparatorNone, DefaultModalPlacement, DefaultSlideButton, DefaultSlideNavigationButton, Directions, Elasticities, ElasticityStyle, EmbedElement, Flex, FlexItem, FormCheckBoxes, FormRadioButtons, FormRatingButtonTypes, FormRatingButtons, 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, Slide, SlideItem, 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, getEvents, getLogs, getState$1 as getState, getStates, getStoreState, getSystem, hideOnScroll, hideOnTime, initialize, isClosed, isOpened, listenLogger, loadActionTable, loadActionTableQuery, loadActionTableRow, loadActionTableRows, loadGlobalScript, loadGlobalStyle, loadStyle, logger, 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 };