@plaidev/karte-action-sdk 1.1.123 → 1.1.124-27946655.bba7dcb4

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);
@@ -910,9 +905,15 @@ const setAutoStart = (on = true) => {
 const MESSAGES_LIMIT = 1000;
 const EVENTS_LIMIT = 1000;
 // 実行ログ
-let messages = [];
+let logs = [];
 // KARTEイベント
 let events = [];
+function getLogs() {
+    return logs;
+}
+function getEvents() {
+    return events;
+}
 // iframe内の場合は親windowを参照する
 function w(w) {
     return w.parent === w ? w : w.parent;
@@ -935,7 +936,6 @@ const logger = {
     },
     warn: (...messages) => {
         const log = { level: 'warn', message: formatLog(messages), date: new Date() };
-        console.log('aaaaaaaaa', w);
         w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'log', log } }, '*');
     },
     event: (name, values) => {
@@ -962,18 +962,18 @@ function listenLogger() {
             return;
         }
         if (detail.method === 'clear') {
-            messages = [];
+            logs = [];
         }
         else if (detail.method === 'clearEvents') {
             events = [];
         }
         else if (detail.method === 'log') {
-            if (MESSAGES_LIMIT <= messages.length) {
-                messages.shift();
+            if (MESSAGES_LIMIT <= logs.length) {
+                logs.shift();
             }
             const { level, message } = detail.log;
             const log = { level, message, date: new Date() };
-            messages.push(log);
+            logs.push(log);
         }
         else if (detail.method === 'event') {
             if (EVENTS_LIMIT <= events.length) {
@@ -1383,6 +1383,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) される前にフックする関数
  *
@@ -1472,6 +1556,7 @@ function create(App, options = {
     send: () => { },
     props: {},
     variables: {},
+    localVariablesQuery: undefined,
 }) {
     let app = null;
     const data = {
@@ -1484,7 +1569,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);
     });
@@ -1495,6 +1580,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;
@@ -1723,7 +1812,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;
@@ -1756,7 +1845,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
@@ -1866,6 +1955,7 @@ function createApp(App, options = {
     send: () => { },
     props: {},
     variables: {},
+    localVariablesQuery: undefined,
 }) {
     let app = null;
     const close = () => {
@@ -1902,80 +1992,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 互換のインターフェース
  */
@@ -8389,4 +8405,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, events, finalize, formData, getActionShadowRoot, getCustomHandlers, getCustomVariables, getState$1 as getState, getStates, getStoreState, getSystem, hideOnScroll, hideOnTime, initialize, isClosed, isOpened, listenConsoleLogger, listenLogger, loadGlobalScript, loadGlobalStyle, loadStyle, logger, messages, 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, listenConsoleLogger, 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 };