@plaidev/karte-action-sdk 1.1.124 → 1.1.125-27947768.57120ff7
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/hydrate/index.es.d.ts +191 -64
- package/dist/hydrate/index.es.js +110 -129
- package/dist/index.es.d.ts +191 -64
- package/dist/index.es.js +122 -160
- package/package.json +1 -1
package/dist/index.es.js
CHANGED
@@ -6,10 +6,6 @@ import { setContext, getContext, createEventDispatcher, onMount, onDestroy as on
|
|
6
6
|
/** @internal */
|
7
7
|
const NOOP = (_args) => { }; // eslint-disable-line @typescript-eslint/no-unused-vars
|
8
8
|
/** @internal */
|
9
|
-
const isPreview = () => {
|
10
|
-
return false;
|
11
|
-
};
|
12
|
-
/** @internal */
|
13
9
|
const handleFocus = (node) => (e) => {
|
14
10
|
if (node) {
|
15
11
|
// trap focus
|
@@ -292,13 +288,11 @@ const state = writable('/');
|
|
292
288
|
* 現在のステートを設定する
|
293
289
|
*
|
294
290
|
* @param stateId - 表示するステートID
|
295
|
-
* @param
|
291
|
+
* @param options - オプション。`options.disableInPreview`でプレビュー時のステート遷移を無効化できます。
|
296
292
|
*
|
297
293
|
* @public
|
298
294
|
*/
|
299
|
-
function setState$1(stateId,
|
300
|
-
if (!force && isPreview())
|
301
|
-
return;
|
295
|
+
function setState$1(stateId, options) {
|
302
296
|
state.set(stateId);
|
303
297
|
}
|
304
298
|
/**
|
@@ -703,15 +697,14 @@ const ACTION_CHANGE_STATE_EVENT = `KARTE-ACTION-CHANGE-STATE-${actionId}`;
|
|
703
697
|
/** @internal */
|
704
698
|
const handleState = (event) => {
|
705
699
|
if (event.detail.actionId === actionId || event.detail.actionId === ALL_ACTION_ID) {
|
706
|
-
setState$1(event.detail.to, event.detail.
|
700
|
+
setState$1(event.detail.to, { disableInPreview: event.detail.disableInPreview });
|
707
701
|
}
|
708
702
|
};
|
709
703
|
/** @internal */
|
710
704
|
const initialize = (setting) => {
|
711
705
|
const newSetting = setActionSetting(setting);
|
712
706
|
if (newSetting.initialState) {
|
713
|
-
|
714
|
-
setState$1(setting?.initialState, force);
|
707
|
+
setState$1(setting?.initialState);
|
715
708
|
}
|
716
709
|
if (newSetting.autoStart) {
|
717
710
|
setStopped(!newSetting.autoStart);
|
@@ -980,24 +973,27 @@ function w(w) {
|
|
980
973
|
*/
|
981
974
|
const logger = {
|
982
975
|
info: (...messages) => {
|
983
|
-
const log = { level: 'info',
|
976
|
+
const log = { level: 'info', messages, date: new Date() };
|
984
977
|
w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'log', log } }, '*');
|
985
978
|
},
|
986
979
|
log: (...messages) => {
|
987
|
-
const log = { level: 'info',
|
980
|
+
const log = { level: 'info', messages, date: new Date() };
|
988
981
|
w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'log', log } }, '*');
|
989
982
|
},
|
990
983
|
error: (...messages) => {
|
991
|
-
const log = { level: 'error',
|
984
|
+
const log = { level: 'error', messages, date: new Date() };
|
992
985
|
w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'log', log } }, '*');
|
993
986
|
},
|
994
987
|
warn: (...messages) => {
|
995
|
-
const log = { level: 'warn',
|
988
|
+
const log = { level: 'warn', messages, date: new Date() };
|
996
989
|
w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'log', log } }, '*');
|
997
990
|
},
|
998
991
|
event: (name, values) => {
|
999
992
|
const event = values ? { name, values, date: new Date() } : { name, date: new Date() };
|
1000
|
-
w(window).postMessage({
|
993
|
+
w(window).postMessage({
|
994
|
+
type: 'KARTE-ACTION-LOGGER',
|
995
|
+
detail: { method: 'event', event, values: values },
|
996
|
+
}, '*');
|
1001
997
|
},
|
1002
998
|
clear: () => {
|
1003
999
|
w(window).postMessage({ type: 'KARTE-ACTION-LOGGER', detail: { method: 'clear' } }, '*');
|
@@ -1007,7 +1003,7 @@ const logger = {
|
|
1007
1003
|
},
|
1008
1004
|
};
|
1009
1005
|
/**
|
1010
|
-
*
|
1006
|
+
* メッセージを実行ログに表示する
|
1011
1007
|
*/
|
1012
1008
|
function listenLogger() {
|
1013
1009
|
const handler = (event) => {
|
@@ -1028,8 +1024,8 @@ function listenLogger() {
|
|
1028
1024
|
if (MESSAGES_LIMIT <= logs.length) {
|
1029
1025
|
logs.shift();
|
1030
1026
|
}
|
1031
|
-
const { level,
|
1032
|
-
const log = { level,
|
1027
|
+
const { level, messages } = detail.log;
|
1028
|
+
const log = { level, messages, date: new Date() };
|
1033
1029
|
logs.push(log);
|
1034
1030
|
}
|
1035
1031
|
else if (detail.method === 'event') {
|
@@ -1048,69 +1044,6 @@ function listenLogger() {
|
|
1048
1044
|
window.removeEventListener('message', handler, false);
|
1049
1045
|
};
|
1050
1046
|
}
|
1051
|
-
const { info, log, error, warn } = console;
|
1052
|
-
/**
|
1053
|
-
* consoleログを実行ログに表示する
|
1054
|
-
*/
|
1055
|
-
function listenConsoleLogger() {
|
1056
|
-
const cleanup = listenLogger();
|
1057
|
-
console.info = function (...messages) {
|
1058
|
-
logger.info(...messages);
|
1059
|
-
info.apply(this, messages);
|
1060
|
-
};
|
1061
|
-
console.log = function (...messages) {
|
1062
|
-
logger.log(...messages);
|
1063
|
-
log.apply(this, messages);
|
1064
|
-
};
|
1065
|
-
console.error = function (...messages) {
|
1066
|
-
logger.error(...messages);
|
1067
|
-
error.apply(this, messages);
|
1068
|
-
};
|
1069
|
-
console.warn = function (...messages) {
|
1070
|
-
logger.warn(...messages);
|
1071
|
-
warn.apply(this, messages);
|
1072
|
-
};
|
1073
|
-
return () => {
|
1074
|
-
cleanup();
|
1075
|
-
console.info = info;
|
1076
|
-
console.log = log;
|
1077
|
-
console.error = error;
|
1078
|
-
console.warn = warn;
|
1079
|
-
};
|
1080
|
-
}
|
1081
|
-
function formatLog(texts) {
|
1082
|
-
if (!texts)
|
1083
|
-
return '';
|
1084
|
-
const s = texts
|
1085
|
-
.reduce((acc, t) => {
|
1086
|
-
let text = '';
|
1087
|
-
try {
|
1088
|
-
if (typeof t === 'string') {
|
1089
|
-
text += t;
|
1090
|
-
}
|
1091
|
-
else if (t instanceof Error) {
|
1092
|
-
text += formatError(t);
|
1093
|
-
}
|
1094
|
-
else {
|
1095
|
-
text += JSON.stringify(t, undefined, 2);
|
1096
|
-
}
|
1097
|
-
}
|
1098
|
-
catch (e) {
|
1099
|
-
//pass
|
1100
|
-
}
|
1101
|
-
acc += text + ' ';
|
1102
|
-
return acc;
|
1103
|
-
}, '')
|
1104
|
-
.trim();
|
1105
|
-
return s.length > 3000 ? s.substr(0, 3000) + '...' : s;
|
1106
|
-
}
|
1107
|
-
function formatError(error) {
|
1108
|
-
if (!error)
|
1109
|
-
return '';
|
1110
|
-
if (error.stack)
|
1111
|
-
return error.stack;
|
1112
|
-
return error.message;
|
1113
|
-
}
|
1114
1047
|
|
1115
1048
|
function doPresent({ direction, deltaRate }, downFn, upFn, condition = false) {
|
1116
1049
|
if (direction === 'down' && deltaRate > 0) {
|
@@ -1492,6 +1425,103 @@ const FormRatingButtonTypes = ['star', 'face'];
|
|
1492
1425
|
/** @internal */
|
1493
1426
|
const DefaultFormRatingButtonType = 'star';
|
1494
1427
|
|
1428
|
+
const DEFAULT_COLLECTION_ENDPOINT = typeof __FLYER_GEN_COLLECTION_API_ENDPOINT__ === 'string'
|
1429
|
+
? __FLYER_GEN_COLLECTION_API_ENDPOINT__
|
1430
|
+
: 'https://t.karte.io/collection';
|
1431
|
+
/**
|
1432
|
+
* アクションテーブルを管理するメソッドを取得する
|
1433
|
+
*
|
1434
|
+
* @param config - 設定情報
|
1435
|
+
*
|
1436
|
+
* @returns メソッドを返します
|
1437
|
+
*
|
1438
|
+
* @public
|
1439
|
+
*/
|
1440
|
+
function collection$1(config) {
|
1441
|
+
const endpoint = config.endpoint || DEFAULT_COLLECTION_ENDPOINT;
|
1442
|
+
const api_key = config.api_key;
|
1443
|
+
const table = config.table;
|
1444
|
+
return {
|
1445
|
+
get(key, cb) {
|
1446
|
+
if (Array.isArray(key)) {
|
1447
|
+
return request(`${endpoint}/getByKeys`, {
|
1448
|
+
api_key,
|
1449
|
+
name: table,
|
1450
|
+
keys: key,
|
1451
|
+
}, cb);
|
1452
|
+
}
|
1453
|
+
else {
|
1454
|
+
request(`${endpoint}/getByKey`, {
|
1455
|
+
api_key,
|
1456
|
+
name: table,
|
1457
|
+
key,
|
1458
|
+
}, cb);
|
1459
|
+
}
|
1460
|
+
},
|
1461
|
+
getByQuery(query_name, params, options, cb) {
|
1462
|
+
request(`${endpoint}/getByQuery`, {
|
1463
|
+
api_key,
|
1464
|
+
name: table,
|
1465
|
+
query_name,
|
1466
|
+
params,
|
1467
|
+
options,
|
1468
|
+
}, cb);
|
1469
|
+
},
|
1470
|
+
set(key, value, cb) {
|
1471
|
+
request(`${endpoint}/set`, {
|
1472
|
+
api_key,
|
1473
|
+
name: table,
|
1474
|
+
key,
|
1475
|
+
value,
|
1476
|
+
}, cb);
|
1477
|
+
},
|
1478
|
+
};
|
1479
|
+
}
|
1480
|
+
function request(url, data, cb) {
|
1481
|
+
fetch(url, {
|
1482
|
+
method: 'POST',
|
1483
|
+
headers: {
|
1484
|
+
'Content-Type': 'text/plain;charset=UTF-8',
|
1485
|
+
},
|
1486
|
+
body: JSON.stringify({ ...data }),
|
1487
|
+
}).then(response => {
|
1488
|
+
if (!response.ok) {
|
1489
|
+
return cb(new Error(`fail to request collection api. reason: ${response.status}`));
|
1490
|
+
}
|
1491
|
+
return cb(null, response.json());
|
1492
|
+
});
|
1493
|
+
}
|
1494
|
+
const loadActionTableRow = async (config, api_key, endpoint) => {
|
1495
|
+
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))));
|
1496
|
+
};
|
1497
|
+
const loadActionTableRows = async (config, api_key, endpoint) => {
|
1498
|
+
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))));
|
1499
|
+
};
|
1500
|
+
const loadActionTableQuery = async (config, api_key, endpoint) => {
|
1501
|
+
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))));
|
1502
|
+
};
|
1503
|
+
const loadActionTable = async (config, api_key, endpoint) => {
|
1504
|
+
const results = await Promise.all(config
|
1505
|
+
.filter(c => c.resolver === 'action-table-row' ||
|
1506
|
+
c.resolver === 'action-table-rows' ||
|
1507
|
+
c.resolver === 'action-table-query')
|
1508
|
+
.map(c => {
|
1509
|
+
if (c.resolver === 'action-table-row') {
|
1510
|
+
loadActionTableRow(c, api_key, endpoint);
|
1511
|
+
}
|
1512
|
+
else if (c.resolver === 'action-table-rows') {
|
1513
|
+
loadActionTableRows(c, api_key, endpoint);
|
1514
|
+
}
|
1515
|
+
else if (c.resolver === 'action-table-query') {
|
1516
|
+
loadActionTableQuery(c, api_key, endpoint);
|
1517
|
+
}
|
1518
|
+
}));
|
1519
|
+
return config.reduce((acc, c, i) => {
|
1520
|
+
acc[c.name] = results[i];
|
1521
|
+
return acc;
|
1522
|
+
}, {});
|
1523
|
+
};
|
1524
|
+
|
1495
1525
|
/**
|
1496
1526
|
* アクションが作成 (create) される前にフックする関数
|
1497
1527
|
*
|
@@ -1581,6 +1611,7 @@ function create(App, options = {
|
|
1581
1611
|
send: () => { },
|
1582
1612
|
props: {},
|
1583
1613
|
variables: {},
|
1614
|
+
localVariablesQuery: undefined,
|
1584
1615
|
}) {
|
1585
1616
|
let app = null;
|
1586
1617
|
const data = {
|
@@ -1593,7 +1624,7 @@ function create(App, options = {
|
|
1593
1624
|
// NOTE: onCreateより前にListenする必要がある
|
1594
1625
|
window.addEventListener(ACTION_DESTROY_EVENT, () => {
|
1595
1626
|
const { onDestroyHandlers } = getInternalHandlers();
|
1596
|
-
onDestroyHandlers
|
1627
|
+
onDestroyHandlers?.forEach(h => h(actionProps));
|
1597
1628
|
// 複数回onDestroyを呼ばないようにする処理
|
1598
1629
|
window.removeEventListener('beforeunload', dispatchDestroyEvent);
|
1599
1630
|
});
|
@@ -1604,6 +1635,10 @@ function create(App, options = {
|
|
1604
1635
|
shortenId: data.shorten_id || null,
|
1605
1636
|
campaignId: data.campaign_id || null,
|
1606
1637
|
});
|
1638
|
+
// ActionTable APIへの非同期リクエスト
|
1639
|
+
if (options.localVariablesQuery && data.api_key) {
|
1640
|
+
loadActionTable(options.localVariablesQuery, data.api_key).then(result => setCustomVariables(result));
|
1641
|
+
}
|
1607
1642
|
const close = (trigger = 'none') => {
|
1608
1643
|
if (!app) {
|
1609
1644
|
return;
|
@@ -1842,7 +1877,7 @@ function createFog({ color = '#000', opacity = '50%', zIndex = 999, onclick, })
|
|
1842
1877
|
*/
|
1843
1878
|
function getActionShadowRoot() {
|
1844
1879
|
const root = document.querySelector(`.${KARTE_ACTION_ROOT}[data-${KARTE_ACTION_RID}='${actionId}']`);
|
1845
|
-
if (!root
|
1880
|
+
if (!root?.shadowRoot) {
|
1846
1881
|
return null;
|
1847
1882
|
}
|
1848
1883
|
return root.shadowRoot;
|
@@ -1875,7 +1910,7 @@ async function fixFontFaceIssue(href, cssRules) {
|
|
1875
1910
|
const rules = [];
|
1876
1911
|
const fixedRules = [];
|
1877
1912
|
Array.from(css.cssRules).forEach(cssRule => {
|
1878
|
-
if (cssRule.type
|
1913
|
+
if (cssRule.type !== 5) {
|
1879
1914
|
rules.push(cssRule.cssText);
|
1880
1915
|
}
|
1881
1916
|
// type 5 is @font-face
|
@@ -1985,6 +2020,7 @@ function createApp(App, options = {
|
|
1985
2020
|
send: () => { },
|
1986
2021
|
props: {},
|
1987
2022
|
variables: {},
|
2023
|
+
localVariablesQuery: undefined,
|
1988
2024
|
}) {
|
1989
2025
|
let app = null;
|
1990
2026
|
const close = () => {
|
@@ -2020,80 +2056,6 @@ function createApp(App, options = {
|
|
2020
2056
|
};
|
2021
2057
|
}
|
2022
2058
|
|
2023
|
-
const DEFAULT_COLLECTION_ENDPOINT = typeof __FLYER_GEN_COLLECTION_API_ENDPOINT__ === 'string'
|
2024
|
-
? __FLYER_GEN_COLLECTION_API_ENDPOINT__
|
2025
|
-
: 'https://t.karte.io/collection';
|
2026
|
-
/**
|
2027
|
-
* アクションテーブルを管理するメソッドを取得する
|
2028
|
-
*
|
2029
|
-
* @param config - 設定情報
|
2030
|
-
*
|
2031
|
-
* @returns メソッドを返します
|
2032
|
-
*
|
2033
|
-
* @public
|
2034
|
-
*/
|
2035
|
-
function collection$1(config) {
|
2036
|
-
const endpoint = config.endpoint || DEFAULT_COLLECTION_ENDPOINT;
|
2037
|
-
const api_key = config.api_key;
|
2038
|
-
const table = config.table;
|
2039
|
-
return {
|
2040
|
-
get(key, cb) {
|
2041
|
-
if (Array.isArray(key)) {
|
2042
|
-
return request(`${endpoint}/getByKeys`, {
|
2043
|
-
api_key,
|
2044
|
-
name: table,
|
2045
|
-
keys: key,
|
2046
|
-
}, cb);
|
2047
|
-
}
|
2048
|
-
else {
|
2049
|
-
request(`${endpoint}/getByKey`, {
|
2050
|
-
api_key,
|
2051
|
-
name: table,
|
2052
|
-
key,
|
2053
|
-
}, cb);
|
2054
|
-
}
|
2055
|
-
},
|
2056
|
-
getByQuery(query_name, params, options, cb) {
|
2057
|
-
request(`${endpoint}/getByQuery`, {
|
2058
|
-
api_key,
|
2059
|
-
name: table,
|
2060
|
-
query_name,
|
2061
|
-
params,
|
2062
|
-
options,
|
2063
|
-
}, cb);
|
2064
|
-
},
|
2065
|
-
set(key, value, cb) {
|
2066
|
-
request(`${endpoint}/set`, {
|
2067
|
-
api_key,
|
2068
|
-
name: table,
|
2069
|
-
key,
|
2070
|
-
value,
|
2071
|
-
}, cb);
|
2072
|
-
},
|
2073
|
-
};
|
2074
|
-
}
|
2075
|
-
function request(url, data, cb) {
|
2076
|
-
const xhr = new XMLHttpRequest();
|
2077
|
-
xhr.onreadystatechange = () => {
|
2078
|
-
if (xhr.readyState != 4) {
|
2079
|
-
return;
|
2080
|
-
}
|
2081
|
-
if (xhr.status != 200) {
|
2082
|
-
return cb(new Error(`fail to send collection api request. reason: ${xhr.responseText}`));
|
2083
|
-
}
|
2084
|
-
try {
|
2085
|
-
data = JSON.parse(xhr.responseText);
|
2086
|
-
return cb(null, data);
|
2087
|
-
}
|
2088
|
-
catch (err) {
|
2089
|
-
return cb(err);
|
2090
|
-
}
|
2091
|
-
};
|
2092
|
-
xhr.open('POST', url);
|
2093
|
-
xhr.setRequestHeader('Content-Type', 'text/plain;charset=UTF-8');
|
2094
|
-
xhr.send(JSON.stringify({ ...data }));
|
2095
|
-
}
|
2096
|
-
|
2097
2059
|
/**
|
2098
2060
|
* Widget API 互換のインターフェース
|
2099
2061
|
*/
|
@@ -7892,4 +7854,4 @@ class ImageBlock extends SvelteComponent {
|
|
7892
7854
|
}
|
7893
7855
|
}
|
7894
7856
|
|
7895
|
-
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,
|
7857
|
+
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 };
|