@plaidev/karte-action-sdk 1.1.221 → 1.1.222
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/hydrate/index.es.d.ts +70 -1
- package/dist/hydrate/index.es.js +242 -129
- package/dist/index.es.d.ts +70 -1
- package/dist/index.es.js +242 -129
- package/package.json +1 -1
@@ -1515,6 +1515,75 @@ declare function createFog({ color, opacity, zIndex, onclick }: {
|
|
1515
1515
|
fog: HTMLDivElement;
|
1516
1516
|
close: () => void;
|
1517
1517
|
};
|
1518
|
+
type AnswerValue = {
|
1519
|
+
choices: string[];
|
1520
|
+
} | {
|
1521
|
+
free_answer: string;
|
1522
|
+
};
|
1523
|
+
/**
|
1524
|
+
* 選択式のアンケート回答を追加する
|
1525
|
+
*
|
1526
|
+
* @param questionId - 質問ID
|
1527
|
+
* @param choices - 回答内容
|
1528
|
+
*
|
1529
|
+
* @public
|
1530
|
+
*/
|
1531
|
+
declare function addChoiceAnswer(questionId: string, choices: string[], validation?: {
|
1532
|
+
isValid: boolean;
|
1533
|
+
statePath: string;
|
1534
|
+
}): void;
|
1535
|
+
/**
|
1536
|
+
* 自由記述式のアンケート回答を追加する
|
1537
|
+
*
|
1538
|
+
* @param questionId - 質問ID
|
1539
|
+
* @param freeAnswer - 回答内容
|
1540
|
+
*
|
1541
|
+
* @public
|
1542
|
+
*/
|
1543
|
+
declare function addFreeAnswer(questionId: string, freeAnswer: string, validation?: {
|
1544
|
+
isValid: boolean;
|
1545
|
+
statePath: string;
|
1546
|
+
}): void;
|
1547
|
+
/**
|
1548
|
+
* 回答済の回答を削除
|
1549
|
+
*
|
1550
|
+
* @param questionId - 質問ID
|
1551
|
+
*
|
1552
|
+
* @public
|
1553
|
+
*/
|
1554
|
+
declare function removeAnswer(questionId: string): void;
|
1555
|
+
/**
|
1556
|
+
* 回答済の回答内容を取得する
|
1557
|
+
*
|
1558
|
+
* @param questionId - 質問ID
|
1559
|
+
*
|
1560
|
+
* @returns 回答データ
|
1561
|
+
*
|
1562
|
+
* @public
|
1563
|
+
*/
|
1564
|
+
declare function getAnsweredQuestion(questionId: string): AnswerValue | undefined;
|
1565
|
+
/**
|
1566
|
+
* 回答済の回答IDのリストを取得
|
1567
|
+
*
|
1568
|
+
* @returns 回答済の質問の質問IDの配列
|
1569
|
+
*
|
1570
|
+
* @public
|
1571
|
+
*/
|
1572
|
+
declare function getAnsweredQuestionIds(): string[];
|
1573
|
+
/**
|
1574
|
+
* `sendAnswers`のエイリアス
|
1575
|
+
*
|
1576
|
+
* @public
|
1577
|
+
*/
|
1578
|
+
declare function sendAnswer(): boolean;
|
1579
|
+
/**
|
1580
|
+
* 回答済の回答をまとめてイベントとして送信する
|
1581
|
+
*
|
1582
|
+
* @returns イベント送信の成功/失敗
|
1583
|
+
*
|
1584
|
+
* @public
|
1585
|
+
*/
|
1586
|
+
declare function sendAnswers(): boolean;
|
1518
1587
|
declare namespace widget {
|
1519
1588
|
/**
|
1520
1589
|
* アクションの汎用的なタイプを定義する
|
@@ -2277,7 +2346,7 @@ declare const afterUpdate: typeof afterUpdateSvelte;
|
|
2277
2346
|
declare const tick: typeof tickSvelte;
|
2278
2347
|
// @internal
|
2279
2348
|
declare const LAYOUT_COMPONENT_NAMES: string[];
|
2280
|
-
export { ACTION_HOOK_LABEL, KARTE_MODAL_ROOT, create, destroyAction, onCreate, onDestroy, showModal, destroy, initialize, finalize, loadGlobalScript, loadGlobalStyle, applyGlobalCss, getState, setState, getStates, isOpened, getVariables, setVariables, resetVariables, getEventHandlers, setEventHandlers, resetEventHandlers, getSystem, setSetting, eventHandlers, variables, formData, state, onScroll, onTime, getLogs, getEvents, logger, listenLogger, hideOnScroll, hideOnTime, showOnScroll, showOnTime, PropTypes, PropType, Code, MediaQueries, MediaQuery, Directions, Direction, AnimationStyles, AnimationStyle, ModalPositions, ModalPosition, ModalMargin, ModalPlacement, DefaultModalPlacement, Elasticities, Elasticity, ElasticityStyle, DefaultElasticity, TextDirections, TextDirection, OperationArgumentType, Operation, OnClickOperationOptions, OnClickOperation, LongText, Url, RegExpProp, Image, LengthUnits, LengthUnit, Length, Color, FontWeight, SYSTEM_FONT, Fonts, Font, Justifies, Justify, Alignments, Alignment, FlexDirections, FlexDirection, ObjectFits, ObjectFit, ClipPaths, ClipPath, Repeats, Repeat, BackgroundSizes, BackgroundSize, Cursors, Cursor, Overflows, Overflow, Border, BorderStyle, BorderWidth, BoxShadow, Style, TransitState, WritingModes, WritingMode, DateTime, Icon, ListSeparatorTypes, EdgePosition, DefaultEdgePosition, ListSeparatorNone, ListSeparatorBorder, ListSeparatorGap, ListSeparator, DefaultListSeparatorNone, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparator, ListBackgroundTypes, ListBackgroundNone, ListBackgroundStripe, ListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListBackground, ListDirections, ListDirection, ListContext, SlideButtonIcon, SlideButtonText, SlideButton, DefaultSlideButton, SlideButtonPosition, SlideNavigationButton, DefaultSlideNavigationButton, FormInputName, FormButtonColor, DefaultFormButtonColor, ModalStyle, ModalBreakPoint, DefaultModalBreakPoint, FormIdentifyTextFields, FormIdentifyTextField, FormIdentifyTextFieldValidations, FormIdentifyTextFieldPlaceholders, DefaultFormIdentifyTextField, FormIdentifyBooleanFields, FormIdentifyBooleanField, DefaultFormIdentifyBooleanField, showAction, closeAction, loadStyle, applyCss, onShow, onClose, onChangeState, getActionRoot, getCssVariables, show, close, ensureModalRoot, createApp, createFog, collection, loadActionTableRow, loadActionTableRows, loadActionTableQuery, loadActionTable, widget, onMount, onDestory, beforeUpdate, afterUpdate, tick, LAYOUT_COMPONENT_NAMES };
|
2349
|
+
export { ACTION_HOOK_LABEL, KARTE_MODAL_ROOT, create, destroyAction, onCreate, onDestroy, showModal, destroy, initialize, finalize, loadGlobalScript, loadGlobalStyle, applyGlobalCss, getState, setState, getStates, isOpened, getVariables, setVariables, resetVariables, getEventHandlers, setEventHandlers, resetEventHandlers, getSystem, setSetting, eventHandlers, variables, formData, state, onScroll, onTime, getLogs, getEvents, logger, listenLogger, hideOnScroll, hideOnTime, showOnScroll, showOnTime, PropTypes, PropType, Code, MediaQueries, MediaQuery, Directions, Direction, AnimationStyles, AnimationStyle, ModalPositions, ModalPosition, ModalMargin, ModalPlacement, DefaultModalPlacement, Elasticities, Elasticity, ElasticityStyle, DefaultElasticity, TextDirections, TextDirection, OperationArgumentType, Operation, OnClickOperationOptions, OnClickOperation, LongText, Url, RegExpProp, Image, LengthUnits, LengthUnit, Length, Color, FontWeight, SYSTEM_FONT, Fonts, Font, Justifies, Justify, Alignments, Alignment, FlexDirections, FlexDirection, ObjectFits, ObjectFit, ClipPaths, ClipPath, Repeats, Repeat, BackgroundSizes, BackgroundSize, Cursors, Cursor, Overflows, Overflow, Border, BorderStyle, BorderWidth, BoxShadow, Style, TransitState, WritingModes, WritingMode, DateTime, Icon, ListSeparatorTypes, EdgePosition, DefaultEdgePosition, ListSeparatorNone, ListSeparatorBorder, ListSeparatorGap, ListSeparator, DefaultListSeparatorNone, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparator, ListBackgroundTypes, ListBackgroundNone, ListBackgroundStripe, ListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListBackground, ListDirections, ListDirection, ListContext, SlideButtonIcon, SlideButtonText, SlideButton, DefaultSlideButton, SlideButtonPosition, SlideNavigationButton, DefaultSlideNavigationButton, FormInputName, FormButtonColor, DefaultFormButtonColor, ModalStyle, ModalBreakPoint, DefaultModalBreakPoint, FormIdentifyTextFields, FormIdentifyTextField, FormIdentifyTextFieldValidations, FormIdentifyTextFieldPlaceholders, DefaultFormIdentifyTextField, FormIdentifyBooleanFields, FormIdentifyBooleanField, DefaultFormIdentifyBooleanField, showAction, closeAction, loadStyle, applyCss, onShow, onClose, onChangeState, getActionRoot, getCssVariables, show, close, ensureModalRoot, createApp, createFog, collection, loadActionTableRow, loadActionTableRows, loadActionTableQuery, loadActionTable, addChoiceAnswer, addFreeAnswer, removeAnswer, getAnsweredQuestion, getAnsweredQuestionIds, sendAnswer, sendAnswers, widget, onMount, onDestory, beforeUpdate, afterUpdate, tick, LAYOUT_COMPONENT_NAMES };
|
2281
2350
|
export type { SystemConfig, ActionVariables, ActionEventHandler, ActionProps, ActionOptions, ActionHook, ActionHookLog, ActionChangeStateHook, SendFunction, PublishFunction, OnScrollContext, OnScrollFunction, ScrollDirection, LogLevel, Log, Event, ActionCloseHook, ShowTrigger, CloseTrigger, CollectionConfig, ActionTableRowRequestConfig, ActionTableRowsRequestConfig, ActionTableQueryRequestConfig, ActionTableRequestConfig };
|
2282
2351
|
export { default as State } from './components/State.svelte';
|
2283
2352
|
export { default as StateItem } from './components/StateItem.svelte';
|
package/dist/hydrate/index.es.js
CHANGED
@@ -2255,6 +2255,247 @@ function destroy() {
|
|
2255
2255
|
dispatchDestroyEvent();
|
2256
2256
|
}
|
2257
2257
|
|
2258
|
+
const USER_ID_VARIABLE_NAME = '__karte_form_identify_user_id';
|
2259
|
+
const MAX_LENGTH_FREE_ANSWER = 2000;
|
2260
|
+
function isEmpty(value) {
|
2261
|
+
if (Array.isArray(value)) {
|
2262
|
+
return value.length === 0;
|
2263
|
+
}
|
2264
|
+
else {
|
2265
|
+
return !value;
|
2266
|
+
}
|
2267
|
+
}
|
2268
|
+
/** @internal */
|
2269
|
+
function createInputRegisterer(formData) {
|
2270
|
+
const registerInput = ({ name, statePath, validator = () => true, initialValue, }) => {
|
2271
|
+
const writableValue = {
|
2272
|
+
subscribe(run) {
|
2273
|
+
return formData.subscribe(formData => {
|
2274
|
+
run(formData[name]?.value);
|
2275
|
+
});
|
2276
|
+
},
|
2277
|
+
set(value) {
|
2278
|
+
formData.update(prev => ({
|
2279
|
+
...prev,
|
2280
|
+
[name]: {
|
2281
|
+
statePath,
|
2282
|
+
value,
|
2283
|
+
isValid: validator(value),
|
2284
|
+
},
|
2285
|
+
}));
|
2286
|
+
},
|
2287
|
+
update(updater) {
|
2288
|
+
formData.update(prev => {
|
2289
|
+
const prevValue = prev[name]?.value;
|
2290
|
+
if (prevValue === undefined)
|
2291
|
+
return prev;
|
2292
|
+
const value = updater(prevValue);
|
2293
|
+
return {
|
2294
|
+
...prev,
|
2295
|
+
[name]: {
|
2296
|
+
statePath,
|
2297
|
+
value,
|
2298
|
+
isValid: validator(value),
|
2299
|
+
},
|
2300
|
+
};
|
2301
|
+
});
|
2302
|
+
},
|
2303
|
+
};
|
2304
|
+
const readableIsValid = {
|
2305
|
+
subscribe(run) {
|
2306
|
+
return formData.subscribe(formData => {
|
2307
|
+
run(formData[name]?.isValid);
|
2308
|
+
});
|
2309
|
+
},
|
2310
|
+
};
|
2311
|
+
if (isEmpty(get(writableValue))) {
|
2312
|
+
writableValue.set(initialValue);
|
2313
|
+
}
|
2314
|
+
return {
|
2315
|
+
value: writableValue,
|
2316
|
+
isValid: readableIsValid,
|
2317
|
+
};
|
2318
|
+
};
|
2319
|
+
return registerInput;
|
2320
|
+
}
|
2321
|
+
/** @internal */
|
2322
|
+
const registerInput = createInputRegisterer(formData);
|
2323
|
+
/** @internal */
|
2324
|
+
const registerIdentifyInput = createInputRegisterer(identifyFormData);
|
2325
|
+
function validateFormData(formData, statePath) {
|
2326
|
+
return Object.entries(formData)
|
2327
|
+
.filter(([_, { statePath: s }]) => s === statePath) // eslint-disable-line @typescript-eslint/no-unused-vars
|
2328
|
+
.every(([_, { isValid }]) => isValid); // eslint-disable-line @typescript-eslint/no-unused-vars
|
2329
|
+
}
|
2330
|
+
/** @internal */
|
2331
|
+
const getValuesAreValidReadable = statePath => ({
|
2332
|
+
subscribe(callback) {
|
2333
|
+
return formData.subscribe(formData => identifyFormData.subscribe(identifyFormData => {
|
2334
|
+
const valuesAreValid = validateFormData(formData, statePath) && validateFormData(identifyFormData, statePath);
|
2335
|
+
callback(valuesAreValid);
|
2336
|
+
}));
|
2337
|
+
},
|
2338
|
+
});
|
2339
|
+
function createAnswerValue(value) {
|
2340
|
+
if (Array.isArray(value)) {
|
2341
|
+
return {
|
2342
|
+
choices: value,
|
2343
|
+
};
|
2344
|
+
}
|
2345
|
+
else if (typeof value === 'string') {
|
2346
|
+
return {
|
2347
|
+
free_answer: value,
|
2348
|
+
};
|
2349
|
+
}
|
2350
|
+
}
|
2351
|
+
function formDataToEventValues(campaignId, formData) {
|
2352
|
+
const questions = [];
|
2353
|
+
const answersMap = {};
|
2354
|
+
Object.entries(formData).forEach(([name, dataItem]) => {
|
2355
|
+
questions.push(name);
|
2356
|
+
const value = dataItem.value;
|
2357
|
+
const answerKey = `question_${name}`;
|
2358
|
+
const answerValue = createAnswerValue(value);
|
2359
|
+
answersMap[answerKey] = answerValue;
|
2360
|
+
});
|
2361
|
+
return {
|
2362
|
+
[campaignId]: {
|
2363
|
+
questions,
|
2364
|
+
...answersMap,
|
2365
|
+
},
|
2366
|
+
};
|
2367
|
+
}
|
2368
|
+
function formDataToIdentifyEventValues(formData) {
|
2369
|
+
return Object.fromEntries(Object.entries(formData).map(([name, dataItem]) => {
|
2370
|
+
const value = dataItem.value;
|
2371
|
+
return [name, value];
|
2372
|
+
}));
|
2373
|
+
}
|
2374
|
+
/** @internal */
|
2375
|
+
function submit() {
|
2376
|
+
const systemConfig = getSystem();
|
2377
|
+
const campaignId = systemConfig.campaignId;
|
2378
|
+
if (campaignId) {
|
2379
|
+
const formData$1 = get(formData);
|
2380
|
+
const identifyFormData$1 = get(identifyFormData);
|
2381
|
+
const values = formDataToEventValues(campaignId, formData$1);
|
2382
|
+
const identifyValues = formDataToIdentifyEventValues(identifyFormData$1);
|
2383
|
+
if (Object.keys(identifyValues).length > 0) {
|
2384
|
+
identifyValues['user_id'] = getVariables()?.[USER_ID_VARIABLE_NAME];
|
2385
|
+
}
|
2386
|
+
return { values, identifyValues };
|
2387
|
+
}
|
2388
|
+
return {};
|
2389
|
+
}
|
2390
|
+
/**
|
2391
|
+
* 選択式のアンケート回答を追加する
|
2392
|
+
*
|
2393
|
+
* @param questionId - 質問ID
|
2394
|
+
* @param choices - 回答内容
|
2395
|
+
*
|
2396
|
+
* @public
|
2397
|
+
*/
|
2398
|
+
function addChoiceAnswer(questionId, choices, validation) {
|
2399
|
+
formData.update(prev => ({
|
2400
|
+
...prev,
|
2401
|
+
[questionId]: {
|
2402
|
+
value: choices,
|
2403
|
+
statePath: validation?.statePath ?? '',
|
2404
|
+
isValid: validation?.isValid ?? true,
|
2405
|
+
},
|
2406
|
+
}));
|
2407
|
+
}
|
2408
|
+
/**
|
2409
|
+
* 自由記述式のアンケート回答を追加する
|
2410
|
+
*
|
2411
|
+
* @param questionId - 質問ID
|
2412
|
+
* @param freeAnswer - 回答内容
|
2413
|
+
*
|
2414
|
+
* @public
|
2415
|
+
*/
|
2416
|
+
function addFreeAnswer(questionId, freeAnswer, validation) {
|
2417
|
+
formData.update(prev => ({
|
2418
|
+
...prev,
|
2419
|
+
[questionId]: {
|
2420
|
+
value: freeAnswer.slice(0, MAX_LENGTH_FREE_ANSWER),
|
2421
|
+
statePath: validation?.statePath ?? '',
|
2422
|
+
isValid: validation?.isValid ?? true,
|
2423
|
+
},
|
2424
|
+
}));
|
2425
|
+
}
|
2426
|
+
/**
|
2427
|
+
* 回答済の回答を削除
|
2428
|
+
*
|
2429
|
+
* @param questionId - 質問ID
|
2430
|
+
*
|
2431
|
+
* @public
|
2432
|
+
*/
|
2433
|
+
function removeAnswer(questionId) {
|
2434
|
+
formData.update(prev => {
|
2435
|
+
const next = { ...prev };
|
2436
|
+
delete next[questionId];
|
2437
|
+
return next;
|
2438
|
+
});
|
2439
|
+
}
|
2440
|
+
/**
|
2441
|
+
* 回答済の回答内容を取得する
|
2442
|
+
*
|
2443
|
+
* @param questionId - 質問ID
|
2444
|
+
*
|
2445
|
+
* @returns 回答データ
|
2446
|
+
*
|
2447
|
+
* @public
|
2448
|
+
*/
|
2449
|
+
function getAnsweredQuestion(questionId) {
|
2450
|
+
const formData$1 = get(formData);
|
2451
|
+
const valueState = formData$1[questionId];
|
2452
|
+
if (valueState) {
|
2453
|
+
return createAnswerValue(valueState.value);
|
2454
|
+
}
|
2455
|
+
}
|
2456
|
+
/**
|
2457
|
+
* 回答済の回答IDのリストを取得
|
2458
|
+
*
|
2459
|
+
* @returns 回答済の質問の質問IDの配列
|
2460
|
+
*
|
2461
|
+
* @public
|
2462
|
+
*/
|
2463
|
+
function getAnsweredQuestionIds() {
|
2464
|
+
const formData$1 = get(formData);
|
2465
|
+
return Object.keys(formData$1);
|
2466
|
+
}
|
2467
|
+
/**
|
2468
|
+
* `sendAnswers`のエイリアス
|
2469
|
+
*
|
2470
|
+
* @public
|
2471
|
+
*/
|
2472
|
+
function sendAnswer() {
|
2473
|
+
return sendAnswers();
|
2474
|
+
}
|
2475
|
+
// NOTE: sendAnswers用
|
2476
|
+
let isSent = false;
|
2477
|
+
/**
|
2478
|
+
* 回答済の回答をまとめてイベントとして送信する
|
2479
|
+
*
|
2480
|
+
* @returns イベント送信の成功/失敗
|
2481
|
+
*
|
2482
|
+
* @public
|
2483
|
+
*/
|
2484
|
+
function sendAnswers() {
|
2485
|
+
const { values, identifyValues } = submit();
|
2486
|
+
if (isSent)
|
2487
|
+
return false;
|
2488
|
+
if (Object.keys(values ?? {}).length === 0 && Object.keys(identifyValues ?? {}).length === 0) {
|
2489
|
+
return false;
|
2490
|
+
}
|
2491
|
+
send_event('_answer_question', values);
|
2492
|
+
if (Object.keys(identifyValues ?? {}).length > 0) {
|
2493
|
+
send_event('identify', identifyValues);
|
2494
|
+
}
|
2495
|
+
isSent = true;
|
2496
|
+
return true;
|
2497
|
+
}
|
2498
|
+
|
2258
2499
|
/**
|
2259
2500
|
* エディタv1のWidget API 互換のインターフェース
|
2260
2501
|
*/
|
@@ -2913,134 +3154,6 @@ class StateItem extends SvelteComponent {
|
|
2913
3154
|
}
|
2914
3155
|
}
|
2915
3156
|
|
2916
|
-
const USER_ID_VARIABLE_NAME = '__karte_form_identify_user_id';
|
2917
|
-
function isEmpty(value) {
|
2918
|
-
if (Array.isArray(value)) {
|
2919
|
-
return value.length === 0;
|
2920
|
-
}
|
2921
|
-
else {
|
2922
|
-
return !value;
|
2923
|
-
}
|
2924
|
-
}
|
2925
|
-
/** @internal */
|
2926
|
-
function createInputRegisterer(formData) {
|
2927
|
-
const registerInput = ({ name, statePath, validator = () => true, initialValue, }) => {
|
2928
|
-
const writableValue = {
|
2929
|
-
subscribe(run) {
|
2930
|
-
return formData.subscribe(formData => {
|
2931
|
-
run(formData[name]?.value);
|
2932
|
-
});
|
2933
|
-
},
|
2934
|
-
set(value) {
|
2935
|
-
formData.update(prev => ({
|
2936
|
-
...prev,
|
2937
|
-
[name]: {
|
2938
|
-
statePath,
|
2939
|
-
value,
|
2940
|
-
isValid: validator(value),
|
2941
|
-
},
|
2942
|
-
}));
|
2943
|
-
},
|
2944
|
-
update(updater) {
|
2945
|
-
formData.update(prev => {
|
2946
|
-
const prevValue = prev[name]?.value;
|
2947
|
-
if (prevValue === undefined)
|
2948
|
-
return prev;
|
2949
|
-
const value = updater(prevValue);
|
2950
|
-
return {
|
2951
|
-
...prev,
|
2952
|
-
[name]: {
|
2953
|
-
statePath,
|
2954
|
-
value,
|
2955
|
-
isValid: validator(value),
|
2956
|
-
},
|
2957
|
-
};
|
2958
|
-
});
|
2959
|
-
},
|
2960
|
-
};
|
2961
|
-
const readableIsValid = {
|
2962
|
-
subscribe(run) {
|
2963
|
-
return formData.subscribe(formData => {
|
2964
|
-
run(formData[name]?.isValid);
|
2965
|
-
});
|
2966
|
-
},
|
2967
|
-
};
|
2968
|
-
if (isEmpty(get(writableValue))) {
|
2969
|
-
writableValue.set(initialValue);
|
2970
|
-
}
|
2971
|
-
return {
|
2972
|
-
value: writableValue,
|
2973
|
-
isValid: readableIsValid,
|
2974
|
-
};
|
2975
|
-
};
|
2976
|
-
return registerInput;
|
2977
|
-
}
|
2978
|
-
/** @internal */
|
2979
|
-
const registerInput = createInputRegisterer(formData);
|
2980
|
-
/** @internal */
|
2981
|
-
const registerIdentifyInput = createInputRegisterer(identifyFormData);
|
2982
|
-
function validateFormData(formData, statePath) {
|
2983
|
-
return Object.entries(formData)
|
2984
|
-
.filter(([_, { statePath: s }]) => s === statePath) // eslint-disable-line @typescript-eslint/no-unused-vars
|
2985
|
-
.every(([_, { isValid }]) => isValid); // eslint-disable-line @typescript-eslint/no-unused-vars
|
2986
|
-
}
|
2987
|
-
/** @internal */
|
2988
|
-
const getValuesAreValidReadable = statePath => ({
|
2989
|
-
subscribe(callback) {
|
2990
|
-
return formData.subscribe(formData => identifyFormData.subscribe(identifyFormData => {
|
2991
|
-
const valuesAreValid = validateFormData(formData, statePath) && validateFormData(identifyFormData, statePath);
|
2992
|
-
callback(valuesAreValid);
|
2993
|
-
}));
|
2994
|
-
},
|
2995
|
-
});
|
2996
|
-
function formDataToEventValues(campaignId, formData) {
|
2997
|
-
const questions = [];
|
2998
|
-
const answersMap = {};
|
2999
|
-
Object.entries(formData).forEach(([name, dataItem]) => {
|
3000
|
-
questions.push(name);
|
3001
|
-
const value = dataItem.value;
|
3002
|
-
const answerKey = `question_${name}`;
|
3003
|
-
if (Array.isArray(value)) {
|
3004
|
-
answersMap[answerKey] = {
|
3005
|
-
choices: value,
|
3006
|
-
};
|
3007
|
-
}
|
3008
|
-
else if (typeof value === 'string') {
|
3009
|
-
answersMap[answerKey] = {
|
3010
|
-
free_answer: value,
|
3011
|
-
};
|
3012
|
-
}
|
3013
|
-
});
|
3014
|
-
return {
|
3015
|
-
[campaignId]: {
|
3016
|
-
questions,
|
3017
|
-
...answersMap,
|
3018
|
-
},
|
3019
|
-
};
|
3020
|
-
}
|
3021
|
-
function formDataToIdentifyEventValues(formData) {
|
3022
|
-
return Object.fromEntries(Object.entries(formData).map(([name, dataItem]) => {
|
3023
|
-
const value = dataItem.value;
|
3024
|
-
return [name, value];
|
3025
|
-
}));
|
3026
|
-
}
|
3027
|
-
/** @internal */
|
3028
|
-
function submit() {
|
3029
|
-
const systemConfig = getSystem();
|
3030
|
-
const campaignId = systemConfig.campaignId;
|
3031
|
-
if (campaignId) {
|
3032
|
-
const formData$1 = get(formData);
|
3033
|
-
const identifyFormData$1 = get(identifyFormData);
|
3034
|
-
const values = formDataToEventValues(campaignId, formData$1);
|
3035
|
-
const identifyValues = formDataToIdentifyEventValues(identifyFormData$1);
|
3036
|
-
if (Object.keys(identifyValues).length > 0) {
|
3037
|
-
identifyValues['user_id'] = getVariables()?.[USER_ID_VARIABLE_NAME];
|
3038
|
-
}
|
3039
|
-
return { values, identifyValues };
|
3040
|
-
}
|
3041
|
-
return {};
|
3042
|
-
}
|
3043
|
-
|
3044
3157
|
/**
|
3045
3158
|
* モーダル(ポップアップ)のコンポーネントが利用するコードの管理
|
3046
3159
|
*/
|
@@ -11751,4 +11864,4 @@ class ImageBlock extends SvelteComponent {
|
|
11751
11864
|
}
|
11752
11865
|
}
|
11753
11866
|
|
11754
|
-
export { ACTION_HOOK_LABEL, Alignments, AnimationStyles, BackgroundSizes, Box, ClipPaths, CodeElement, Countdown, Cursors, DefaultEdgePosition, DefaultElasticity, DefaultFormButtonColor, DefaultFormIdentifyBooleanField, DefaultFormIdentifyTextField, DefaultListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListSeparator, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparatorNone, DefaultModalBreakPoint, DefaultModalPlacement, DefaultSlideButton, DefaultSlideNavigationButton, Directions, Elasticities, ElasticityStyle, EmbedElement, Flex, FlexDirections, FlexItem, Fonts, FormCheckBoxes, FormIdentifyBooleanFields, FormIdentifyChoices, FormIdentifyInput, FormIdentifyTextFieldPlaceholders, FormIdentifyTextFieldValidations, FormIdentifyTextFields, FormRadioButtons, FormRatingButtonsFace, FormRatingButtonsNumber, FormSelect, FormTextarea, Grid, GridItem, GridModalState, IconElement, ImageBlock, ImageElement, Justifies, KARTE_MODAL_ROOT, LAYOUT_COMPONENT_NAMES, LengthUnits, List, ListBackgroundTypes, ListDirections, ListItem, ListSeparatorTypes, MediaQueries, Modal, ModalPositions, MovieVimeoElement, MovieYouTubeElement, ObjectFits, OnClickOperationOptions, Overflows, PropTypes, Repeats, SYSTEM_FONT, Slide, SlideItem, State, StateItem, TextBlock, TextButtonBlock, TextButtonElement, TextDirections, TextElement, WritingModes, afterUpdate, applyCss, applyGlobalCss, beforeUpdate, close, closeAction, collection$1 as collection, create, createApp, createFog, destroy, destroyAction, ensureModalRoot, eventHandlers, finalize, formData, getActionRoot, getCssVariables, getEventHandlers, getEvents, getLogs, getState$1 as getState, getStates, getSystem, getVariables, hideOnScroll, hideOnTime, initialize, isOpened, listenLogger, loadActionTable, loadActionTableQuery, loadActionTableRow, loadActionTableRows, loadGlobalScript, loadGlobalStyle, loadStyle, logger, onChangeState, onClose, onCreate, onDestory, onDestroy, onMount, onScroll, onShow, onTime, resetEventHandlers, resetVariables, setEventHandlers, setSetting, setState$1 as setState, setVariables, show, showAction, showModal, showOnScroll, showOnTime, state, tick, variables, widget };
|
11867
|
+
export { ACTION_HOOK_LABEL, Alignments, AnimationStyles, BackgroundSizes, Box, ClipPaths, CodeElement, Countdown, Cursors, DefaultEdgePosition, DefaultElasticity, DefaultFormButtonColor, DefaultFormIdentifyBooleanField, DefaultFormIdentifyTextField, DefaultListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListSeparator, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparatorNone, DefaultModalBreakPoint, DefaultModalPlacement, DefaultSlideButton, DefaultSlideNavigationButton, Directions, Elasticities, ElasticityStyle, EmbedElement, Flex, FlexDirections, FlexItem, Fonts, FormCheckBoxes, FormIdentifyBooleanFields, FormIdentifyChoices, FormIdentifyInput, FormIdentifyTextFieldPlaceholders, FormIdentifyTextFieldValidations, FormIdentifyTextFields, FormRadioButtons, FormRatingButtonsFace, FormRatingButtonsNumber, FormSelect, FormTextarea, Grid, GridItem, GridModalState, IconElement, ImageBlock, ImageElement, Justifies, KARTE_MODAL_ROOT, LAYOUT_COMPONENT_NAMES, LengthUnits, List, ListBackgroundTypes, ListDirections, ListItem, ListSeparatorTypes, MediaQueries, Modal, ModalPositions, MovieVimeoElement, MovieYouTubeElement, ObjectFits, OnClickOperationOptions, Overflows, PropTypes, Repeats, SYSTEM_FONT, Slide, SlideItem, State, StateItem, TextBlock, TextButtonBlock, TextButtonElement, TextDirections, TextElement, WritingModes, addChoiceAnswer, addFreeAnswer, afterUpdate, applyCss, applyGlobalCss, beforeUpdate, close, closeAction, collection$1 as collection, create, createApp, createFog, destroy, destroyAction, ensureModalRoot, eventHandlers, finalize, formData, getActionRoot, getAnsweredQuestion, getAnsweredQuestionIds, getCssVariables, getEventHandlers, getEvents, getLogs, getState$1 as getState, getStates, getSystem, getVariables, hideOnScroll, hideOnTime, initialize, isOpened, listenLogger, loadActionTable, loadActionTableQuery, loadActionTableRow, loadActionTableRows, loadGlobalScript, loadGlobalStyle, loadStyle, logger, onChangeState, onClose, onCreate, onDestory, onDestroy, onMount, onScroll, onShow, onTime, removeAnswer, resetEventHandlers, resetVariables, sendAnswer, sendAnswers, setEventHandlers, setSetting, setState$1 as setState, setVariables, show, showAction, showModal, showOnScroll, showOnTime, state, tick, variables, widget };
|
package/dist/index.es.d.ts
CHANGED
@@ -1515,6 +1515,75 @@ declare function createFog({ color, opacity, zIndex, onclick }: {
|
|
1515
1515
|
fog: HTMLDivElement;
|
1516
1516
|
close: () => void;
|
1517
1517
|
};
|
1518
|
+
type AnswerValue = {
|
1519
|
+
choices: string[];
|
1520
|
+
} | {
|
1521
|
+
free_answer: string;
|
1522
|
+
};
|
1523
|
+
/**
|
1524
|
+
* 選択式のアンケート回答を追加する
|
1525
|
+
*
|
1526
|
+
* @param questionId - 質問ID
|
1527
|
+
* @param choices - 回答内容
|
1528
|
+
*
|
1529
|
+
* @public
|
1530
|
+
*/
|
1531
|
+
declare function addChoiceAnswer(questionId: string, choices: string[], validation?: {
|
1532
|
+
isValid: boolean;
|
1533
|
+
statePath: string;
|
1534
|
+
}): void;
|
1535
|
+
/**
|
1536
|
+
* 自由記述式のアンケート回答を追加する
|
1537
|
+
*
|
1538
|
+
* @param questionId - 質問ID
|
1539
|
+
* @param freeAnswer - 回答内容
|
1540
|
+
*
|
1541
|
+
* @public
|
1542
|
+
*/
|
1543
|
+
declare function addFreeAnswer(questionId: string, freeAnswer: string, validation?: {
|
1544
|
+
isValid: boolean;
|
1545
|
+
statePath: string;
|
1546
|
+
}): void;
|
1547
|
+
/**
|
1548
|
+
* 回答済の回答を削除
|
1549
|
+
*
|
1550
|
+
* @param questionId - 質問ID
|
1551
|
+
*
|
1552
|
+
* @public
|
1553
|
+
*/
|
1554
|
+
declare function removeAnswer(questionId: string): void;
|
1555
|
+
/**
|
1556
|
+
* 回答済の回答内容を取得する
|
1557
|
+
*
|
1558
|
+
* @param questionId - 質問ID
|
1559
|
+
*
|
1560
|
+
* @returns 回答データ
|
1561
|
+
*
|
1562
|
+
* @public
|
1563
|
+
*/
|
1564
|
+
declare function getAnsweredQuestion(questionId: string): AnswerValue | undefined;
|
1565
|
+
/**
|
1566
|
+
* 回答済の回答IDのリストを取得
|
1567
|
+
*
|
1568
|
+
* @returns 回答済の質問の質問IDの配列
|
1569
|
+
*
|
1570
|
+
* @public
|
1571
|
+
*/
|
1572
|
+
declare function getAnsweredQuestionIds(): string[];
|
1573
|
+
/**
|
1574
|
+
* `sendAnswers`のエイリアス
|
1575
|
+
*
|
1576
|
+
* @public
|
1577
|
+
*/
|
1578
|
+
declare function sendAnswer(): boolean;
|
1579
|
+
/**
|
1580
|
+
* 回答済の回答をまとめてイベントとして送信する
|
1581
|
+
*
|
1582
|
+
* @returns イベント送信の成功/失敗
|
1583
|
+
*
|
1584
|
+
* @public
|
1585
|
+
*/
|
1586
|
+
declare function sendAnswers(): boolean;
|
1518
1587
|
declare namespace widget {
|
1519
1588
|
/**
|
1520
1589
|
* アクションの汎用的なタイプを定義する
|
@@ -2277,7 +2346,7 @@ declare const afterUpdate: typeof afterUpdateSvelte;
|
|
2277
2346
|
declare const tick: typeof tickSvelte;
|
2278
2347
|
// @internal
|
2279
2348
|
declare const LAYOUT_COMPONENT_NAMES: string[];
|
2280
|
-
export { ACTION_HOOK_LABEL, KARTE_MODAL_ROOT, create, destroyAction, onCreate, onDestroy, showModal, destroy, initialize, finalize, loadGlobalScript, loadGlobalStyle, applyGlobalCss, getState, setState, getStates, isOpened, getVariables, setVariables, resetVariables, getEventHandlers, setEventHandlers, resetEventHandlers, getSystem, setSetting, eventHandlers, variables, formData, state, onScroll, onTime, getLogs, getEvents, logger, listenLogger, hideOnScroll, hideOnTime, showOnScroll, showOnTime, PropTypes, PropType, Code, MediaQueries, MediaQuery, Directions, Direction, AnimationStyles, AnimationStyle, ModalPositions, ModalPosition, ModalMargin, ModalPlacement, DefaultModalPlacement, Elasticities, Elasticity, ElasticityStyle, DefaultElasticity, TextDirections, TextDirection, OperationArgumentType, Operation, OnClickOperationOptions, OnClickOperation, LongText, Url, RegExpProp, Image, LengthUnits, LengthUnit, Length, Color, FontWeight, SYSTEM_FONT, Fonts, Font, Justifies, Justify, Alignments, Alignment, FlexDirections, FlexDirection, ObjectFits, ObjectFit, ClipPaths, ClipPath, Repeats, Repeat, BackgroundSizes, BackgroundSize, Cursors, Cursor, Overflows, Overflow, Border, BorderStyle, BorderWidth, BoxShadow, Style, TransitState, WritingModes, WritingMode, DateTime, Icon, ListSeparatorTypes, EdgePosition, DefaultEdgePosition, ListSeparatorNone, ListSeparatorBorder, ListSeparatorGap, ListSeparator, DefaultListSeparatorNone, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparator, ListBackgroundTypes, ListBackgroundNone, ListBackgroundStripe, ListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListBackground, ListDirections, ListDirection, ListContext, SlideButtonIcon, SlideButtonText, SlideButton, DefaultSlideButton, SlideButtonPosition, SlideNavigationButton, DefaultSlideNavigationButton, FormInputName, FormButtonColor, DefaultFormButtonColor, ModalStyle, ModalBreakPoint, DefaultModalBreakPoint, FormIdentifyTextFields, FormIdentifyTextField, FormIdentifyTextFieldValidations, FormIdentifyTextFieldPlaceholders, DefaultFormIdentifyTextField, FormIdentifyBooleanFields, FormIdentifyBooleanField, DefaultFormIdentifyBooleanField, showAction, closeAction, loadStyle, applyCss, onShow, onClose, onChangeState, getActionRoot, getCssVariables, show, close, ensureModalRoot, createApp, createFog, collection, loadActionTableRow, loadActionTableRows, loadActionTableQuery, loadActionTable, widget, onMount, onDestory, beforeUpdate, afterUpdate, tick, LAYOUT_COMPONENT_NAMES };
|
2349
|
+
export { ACTION_HOOK_LABEL, KARTE_MODAL_ROOT, create, destroyAction, onCreate, onDestroy, showModal, destroy, initialize, finalize, loadGlobalScript, loadGlobalStyle, applyGlobalCss, getState, setState, getStates, isOpened, getVariables, setVariables, resetVariables, getEventHandlers, setEventHandlers, resetEventHandlers, getSystem, setSetting, eventHandlers, variables, formData, state, onScroll, onTime, getLogs, getEvents, logger, listenLogger, hideOnScroll, hideOnTime, showOnScroll, showOnTime, PropTypes, PropType, Code, MediaQueries, MediaQuery, Directions, Direction, AnimationStyles, AnimationStyle, ModalPositions, ModalPosition, ModalMargin, ModalPlacement, DefaultModalPlacement, Elasticities, Elasticity, ElasticityStyle, DefaultElasticity, TextDirections, TextDirection, OperationArgumentType, Operation, OnClickOperationOptions, OnClickOperation, LongText, Url, RegExpProp, Image, LengthUnits, LengthUnit, Length, Color, FontWeight, SYSTEM_FONT, Fonts, Font, Justifies, Justify, Alignments, Alignment, FlexDirections, FlexDirection, ObjectFits, ObjectFit, ClipPaths, ClipPath, Repeats, Repeat, BackgroundSizes, BackgroundSize, Cursors, Cursor, Overflows, Overflow, Border, BorderStyle, BorderWidth, BoxShadow, Style, TransitState, WritingModes, WritingMode, DateTime, Icon, ListSeparatorTypes, EdgePosition, DefaultEdgePosition, ListSeparatorNone, ListSeparatorBorder, ListSeparatorGap, ListSeparator, DefaultListSeparatorNone, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparator, ListBackgroundTypes, ListBackgroundNone, ListBackgroundStripe, ListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListBackground, ListDirections, ListDirection, ListContext, SlideButtonIcon, SlideButtonText, SlideButton, DefaultSlideButton, SlideButtonPosition, SlideNavigationButton, DefaultSlideNavigationButton, FormInputName, FormButtonColor, DefaultFormButtonColor, ModalStyle, ModalBreakPoint, DefaultModalBreakPoint, FormIdentifyTextFields, FormIdentifyTextField, FormIdentifyTextFieldValidations, FormIdentifyTextFieldPlaceholders, DefaultFormIdentifyTextField, FormIdentifyBooleanFields, FormIdentifyBooleanField, DefaultFormIdentifyBooleanField, showAction, closeAction, loadStyle, applyCss, onShow, onClose, onChangeState, getActionRoot, getCssVariables, show, close, ensureModalRoot, createApp, createFog, collection, loadActionTableRow, loadActionTableRows, loadActionTableQuery, loadActionTable, addChoiceAnswer, addFreeAnswer, removeAnswer, getAnsweredQuestion, getAnsweredQuestionIds, sendAnswer, sendAnswers, widget, onMount, onDestory, beforeUpdate, afterUpdate, tick, LAYOUT_COMPONENT_NAMES };
|
2281
2350
|
export type { SystemConfig, ActionVariables, ActionEventHandler, ActionProps, ActionOptions, ActionHook, ActionHookLog, ActionChangeStateHook, SendFunction, PublishFunction, OnScrollContext, OnScrollFunction, ScrollDirection, LogLevel, Log, Event, ActionCloseHook, ShowTrigger, CloseTrigger, CollectionConfig, ActionTableRowRequestConfig, ActionTableRowsRequestConfig, ActionTableQueryRequestConfig, ActionTableRequestConfig };
|
2282
2351
|
export { default as State } from './components/State.svelte';
|
2283
2352
|
export { default as StateItem } from './components/StateItem.svelte';
|
package/dist/index.es.js
CHANGED
@@ -2312,6 +2312,247 @@ function destroy() {
|
|
2312
2312
|
dispatchDestroyEvent();
|
2313
2313
|
}
|
2314
2314
|
|
2315
|
+
const USER_ID_VARIABLE_NAME = '__karte_form_identify_user_id';
|
2316
|
+
const MAX_LENGTH_FREE_ANSWER = 2000;
|
2317
|
+
function isEmpty(value) {
|
2318
|
+
if (Array.isArray(value)) {
|
2319
|
+
return value.length === 0;
|
2320
|
+
}
|
2321
|
+
else {
|
2322
|
+
return !value;
|
2323
|
+
}
|
2324
|
+
}
|
2325
|
+
/** @internal */
|
2326
|
+
function createInputRegisterer(formData) {
|
2327
|
+
const registerInput = ({ name, statePath, validator = () => true, initialValue, }) => {
|
2328
|
+
const writableValue = {
|
2329
|
+
subscribe(run) {
|
2330
|
+
return formData.subscribe(formData => {
|
2331
|
+
run(formData[name]?.value);
|
2332
|
+
});
|
2333
|
+
},
|
2334
|
+
set(value) {
|
2335
|
+
formData.update(prev => ({
|
2336
|
+
...prev,
|
2337
|
+
[name]: {
|
2338
|
+
statePath,
|
2339
|
+
value,
|
2340
|
+
isValid: validator(value),
|
2341
|
+
},
|
2342
|
+
}));
|
2343
|
+
},
|
2344
|
+
update(updater) {
|
2345
|
+
formData.update(prev => {
|
2346
|
+
const prevValue = prev[name]?.value;
|
2347
|
+
if (prevValue === undefined)
|
2348
|
+
return prev;
|
2349
|
+
const value = updater(prevValue);
|
2350
|
+
return {
|
2351
|
+
...prev,
|
2352
|
+
[name]: {
|
2353
|
+
statePath,
|
2354
|
+
value,
|
2355
|
+
isValid: validator(value),
|
2356
|
+
},
|
2357
|
+
};
|
2358
|
+
});
|
2359
|
+
},
|
2360
|
+
};
|
2361
|
+
const readableIsValid = {
|
2362
|
+
subscribe(run) {
|
2363
|
+
return formData.subscribe(formData => {
|
2364
|
+
run(formData[name]?.isValid);
|
2365
|
+
});
|
2366
|
+
},
|
2367
|
+
};
|
2368
|
+
if (isEmpty(get(writableValue))) {
|
2369
|
+
writableValue.set(initialValue);
|
2370
|
+
}
|
2371
|
+
return {
|
2372
|
+
value: writableValue,
|
2373
|
+
isValid: readableIsValid,
|
2374
|
+
};
|
2375
|
+
};
|
2376
|
+
return registerInput;
|
2377
|
+
}
|
2378
|
+
/** @internal */
|
2379
|
+
const registerInput = createInputRegisterer(formData);
|
2380
|
+
/** @internal */
|
2381
|
+
const registerIdentifyInput = createInputRegisterer(identifyFormData);
|
2382
|
+
function validateFormData(formData, statePath) {
|
2383
|
+
return Object.entries(formData)
|
2384
|
+
.filter(([_, { statePath: s }]) => s === statePath) // eslint-disable-line @typescript-eslint/no-unused-vars
|
2385
|
+
.every(([_, { isValid }]) => isValid); // eslint-disable-line @typescript-eslint/no-unused-vars
|
2386
|
+
}
|
2387
|
+
/** @internal */
|
2388
|
+
const getValuesAreValidReadable = statePath => ({
|
2389
|
+
subscribe(callback) {
|
2390
|
+
return formData.subscribe(formData => identifyFormData.subscribe(identifyFormData => {
|
2391
|
+
const valuesAreValid = validateFormData(formData, statePath) && validateFormData(identifyFormData, statePath);
|
2392
|
+
callback(valuesAreValid);
|
2393
|
+
}));
|
2394
|
+
},
|
2395
|
+
});
|
2396
|
+
function createAnswerValue(value) {
|
2397
|
+
if (Array.isArray(value)) {
|
2398
|
+
return {
|
2399
|
+
choices: value,
|
2400
|
+
};
|
2401
|
+
}
|
2402
|
+
else if (typeof value === 'string') {
|
2403
|
+
return {
|
2404
|
+
free_answer: value,
|
2405
|
+
};
|
2406
|
+
}
|
2407
|
+
}
|
2408
|
+
function formDataToEventValues(campaignId, formData) {
|
2409
|
+
const questions = [];
|
2410
|
+
const answersMap = {};
|
2411
|
+
Object.entries(formData).forEach(([name, dataItem]) => {
|
2412
|
+
questions.push(name);
|
2413
|
+
const value = dataItem.value;
|
2414
|
+
const answerKey = `question_${name}`;
|
2415
|
+
const answerValue = createAnswerValue(value);
|
2416
|
+
answersMap[answerKey] = answerValue;
|
2417
|
+
});
|
2418
|
+
return {
|
2419
|
+
[campaignId]: {
|
2420
|
+
questions,
|
2421
|
+
...answersMap,
|
2422
|
+
},
|
2423
|
+
};
|
2424
|
+
}
|
2425
|
+
function formDataToIdentifyEventValues(formData) {
|
2426
|
+
return Object.fromEntries(Object.entries(formData).map(([name, dataItem]) => {
|
2427
|
+
const value = dataItem.value;
|
2428
|
+
return [name, value];
|
2429
|
+
}));
|
2430
|
+
}
|
2431
|
+
/** @internal */
|
2432
|
+
function submit() {
|
2433
|
+
const systemConfig = getSystem();
|
2434
|
+
const campaignId = systemConfig.campaignId;
|
2435
|
+
if (campaignId) {
|
2436
|
+
const formData$1 = get(formData);
|
2437
|
+
const identifyFormData$1 = get(identifyFormData);
|
2438
|
+
const values = formDataToEventValues(campaignId, formData$1);
|
2439
|
+
const identifyValues = formDataToIdentifyEventValues(identifyFormData$1);
|
2440
|
+
if (Object.keys(identifyValues).length > 0) {
|
2441
|
+
identifyValues['user_id'] = getVariables()?.[USER_ID_VARIABLE_NAME];
|
2442
|
+
}
|
2443
|
+
return { values, identifyValues };
|
2444
|
+
}
|
2445
|
+
return {};
|
2446
|
+
}
|
2447
|
+
/**
|
2448
|
+
* 選択式のアンケート回答を追加する
|
2449
|
+
*
|
2450
|
+
* @param questionId - 質問ID
|
2451
|
+
* @param choices - 回答内容
|
2452
|
+
*
|
2453
|
+
* @public
|
2454
|
+
*/
|
2455
|
+
function addChoiceAnswer(questionId, choices, validation) {
|
2456
|
+
formData.update(prev => ({
|
2457
|
+
...prev,
|
2458
|
+
[questionId]: {
|
2459
|
+
value: choices,
|
2460
|
+
statePath: validation?.statePath ?? '',
|
2461
|
+
isValid: validation?.isValid ?? true,
|
2462
|
+
},
|
2463
|
+
}));
|
2464
|
+
}
|
2465
|
+
/**
|
2466
|
+
* 自由記述式のアンケート回答を追加する
|
2467
|
+
*
|
2468
|
+
* @param questionId - 質問ID
|
2469
|
+
* @param freeAnswer - 回答内容
|
2470
|
+
*
|
2471
|
+
* @public
|
2472
|
+
*/
|
2473
|
+
function addFreeAnswer(questionId, freeAnswer, validation) {
|
2474
|
+
formData.update(prev => ({
|
2475
|
+
...prev,
|
2476
|
+
[questionId]: {
|
2477
|
+
value: freeAnswer.slice(0, MAX_LENGTH_FREE_ANSWER),
|
2478
|
+
statePath: validation?.statePath ?? '',
|
2479
|
+
isValid: validation?.isValid ?? true,
|
2480
|
+
},
|
2481
|
+
}));
|
2482
|
+
}
|
2483
|
+
/**
|
2484
|
+
* 回答済の回答を削除
|
2485
|
+
*
|
2486
|
+
* @param questionId - 質問ID
|
2487
|
+
*
|
2488
|
+
* @public
|
2489
|
+
*/
|
2490
|
+
function removeAnswer(questionId) {
|
2491
|
+
formData.update(prev => {
|
2492
|
+
const next = { ...prev };
|
2493
|
+
delete next[questionId];
|
2494
|
+
return next;
|
2495
|
+
});
|
2496
|
+
}
|
2497
|
+
/**
|
2498
|
+
* 回答済の回答内容を取得する
|
2499
|
+
*
|
2500
|
+
* @param questionId - 質問ID
|
2501
|
+
*
|
2502
|
+
* @returns 回答データ
|
2503
|
+
*
|
2504
|
+
* @public
|
2505
|
+
*/
|
2506
|
+
function getAnsweredQuestion(questionId) {
|
2507
|
+
const formData$1 = get(formData);
|
2508
|
+
const valueState = formData$1[questionId];
|
2509
|
+
if (valueState) {
|
2510
|
+
return createAnswerValue(valueState.value);
|
2511
|
+
}
|
2512
|
+
}
|
2513
|
+
/**
|
2514
|
+
* 回答済の回答IDのリストを取得
|
2515
|
+
*
|
2516
|
+
* @returns 回答済の質問の質問IDの配列
|
2517
|
+
*
|
2518
|
+
* @public
|
2519
|
+
*/
|
2520
|
+
function getAnsweredQuestionIds() {
|
2521
|
+
const formData$1 = get(formData);
|
2522
|
+
return Object.keys(formData$1);
|
2523
|
+
}
|
2524
|
+
/**
|
2525
|
+
* `sendAnswers`のエイリアス
|
2526
|
+
*
|
2527
|
+
* @public
|
2528
|
+
*/
|
2529
|
+
function sendAnswer() {
|
2530
|
+
return sendAnswers();
|
2531
|
+
}
|
2532
|
+
// NOTE: sendAnswers用
|
2533
|
+
let isSent = false;
|
2534
|
+
/**
|
2535
|
+
* 回答済の回答をまとめてイベントとして送信する
|
2536
|
+
*
|
2537
|
+
* @returns イベント送信の成功/失敗
|
2538
|
+
*
|
2539
|
+
* @public
|
2540
|
+
*/
|
2541
|
+
function sendAnswers() {
|
2542
|
+
const { values, identifyValues } = submit();
|
2543
|
+
if (isSent)
|
2544
|
+
return false;
|
2545
|
+
if (Object.keys(values ?? {}).length === 0 && Object.keys(identifyValues ?? {}).length === 0) {
|
2546
|
+
return false;
|
2547
|
+
}
|
2548
|
+
send_event('_answer_question', values);
|
2549
|
+
if (Object.keys(identifyValues ?? {}).length > 0) {
|
2550
|
+
send_event('identify', identifyValues);
|
2551
|
+
}
|
2552
|
+
isSent = true;
|
2553
|
+
return true;
|
2554
|
+
}
|
2555
|
+
|
2315
2556
|
/**
|
2316
2557
|
* エディタv1のWidget API 互換のインターフェース
|
2317
2558
|
*/
|
@@ -2937,134 +3178,6 @@ class StateItem extends SvelteComponent {
|
|
2937
3178
|
}
|
2938
3179
|
}
|
2939
3180
|
|
2940
|
-
const USER_ID_VARIABLE_NAME = '__karte_form_identify_user_id';
|
2941
|
-
function isEmpty(value) {
|
2942
|
-
if (Array.isArray(value)) {
|
2943
|
-
return value.length === 0;
|
2944
|
-
}
|
2945
|
-
else {
|
2946
|
-
return !value;
|
2947
|
-
}
|
2948
|
-
}
|
2949
|
-
/** @internal */
|
2950
|
-
function createInputRegisterer(formData) {
|
2951
|
-
const registerInput = ({ name, statePath, validator = () => true, initialValue, }) => {
|
2952
|
-
const writableValue = {
|
2953
|
-
subscribe(run) {
|
2954
|
-
return formData.subscribe(formData => {
|
2955
|
-
run(formData[name]?.value);
|
2956
|
-
});
|
2957
|
-
},
|
2958
|
-
set(value) {
|
2959
|
-
formData.update(prev => ({
|
2960
|
-
...prev,
|
2961
|
-
[name]: {
|
2962
|
-
statePath,
|
2963
|
-
value,
|
2964
|
-
isValid: validator(value),
|
2965
|
-
},
|
2966
|
-
}));
|
2967
|
-
},
|
2968
|
-
update(updater) {
|
2969
|
-
formData.update(prev => {
|
2970
|
-
const prevValue = prev[name]?.value;
|
2971
|
-
if (prevValue === undefined)
|
2972
|
-
return prev;
|
2973
|
-
const value = updater(prevValue);
|
2974
|
-
return {
|
2975
|
-
...prev,
|
2976
|
-
[name]: {
|
2977
|
-
statePath,
|
2978
|
-
value,
|
2979
|
-
isValid: validator(value),
|
2980
|
-
},
|
2981
|
-
};
|
2982
|
-
});
|
2983
|
-
},
|
2984
|
-
};
|
2985
|
-
const readableIsValid = {
|
2986
|
-
subscribe(run) {
|
2987
|
-
return formData.subscribe(formData => {
|
2988
|
-
run(formData[name]?.isValid);
|
2989
|
-
});
|
2990
|
-
},
|
2991
|
-
};
|
2992
|
-
if (isEmpty(get(writableValue))) {
|
2993
|
-
writableValue.set(initialValue);
|
2994
|
-
}
|
2995
|
-
return {
|
2996
|
-
value: writableValue,
|
2997
|
-
isValid: readableIsValid,
|
2998
|
-
};
|
2999
|
-
};
|
3000
|
-
return registerInput;
|
3001
|
-
}
|
3002
|
-
/** @internal */
|
3003
|
-
const registerInput = createInputRegisterer(formData);
|
3004
|
-
/** @internal */
|
3005
|
-
const registerIdentifyInput = createInputRegisterer(identifyFormData);
|
3006
|
-
function validateFormData(formData, statePath) {
|
3007
|
-
return Object.entries(formData)
|
3008
|
-
.filter(([_, { statePath: s }]) => s === statePath) // eslint-disable-line @typescript-eslint/no-unused-vars
|
3009
|
-
.every(([_, { isValid }]) => isValid); // eslint-disable-line @typescript-eslint/no-unused-vars
|
3010
|
-
}
|
3011
|
-
/** @internal */
|
3012
|
-
const getValuesAreValidReadable = statePath => ({
|
3013
|
-
subscribe(callback) {
|
3014
|
-
return formData.subscribe(formData => identifyFormData.subscribe(identifyFormData => {
|
3015
|
-
const valuesAreValid = validateFormData(formData, statePath) && validateFormData(identifyFormData, statePath);
|
3016
|
-
callback(valuesAreValid);
|
3017
|
-
}));
|
3018
|
-
},
|
3019
|
-
});
|
3020
|
-
function formDataToEventValues(campaignId, formData) {
|
3021
|
-
const questions = [];
|
3022
|
-
const answersMap = {};
|
3023
|
-
Object.entries(formData).forEach(([name, dataItem]) => {
|
3024
|
-
questions.push(name);
|
3025
|
-
const value = dataItem.value;
|
3026
|
-
const answerKey = `question_${name}`;
|
3027
|
-
if (Array.isArray(value)) {
|
3028
|
-
answersMap[answerKey] = {
|
3029
|
-
choices: value,
|
3030
|
-
};
|
3031
|
-
}
|
3032
|
-
else if (typeof value === 'string') {
|
3033
|
-
answersMap[answerKey] = {
|
3034
|
-
free_answer: value,
|
3035
|
-
};
|
3036
|
-
}
|
3037
|
-
});
|
3038
|
-
return {
|
3039
|
-
[campaignId]: {
|
3040
|
-
questions,
|
3041
|
-
...answersMap,
|
3042
|
-
},
|
3043
|
-
};
|
3044
|
-
}
|
3045
|
-
function formDataToIdentifyEventValues(formData) {
|
3046
|
-
return Object.fromEntries(Object.entries(formData).map(([name, dataItem]) => {
|
3047
|
-
const value = dataItem.value;
|
3048
|
-
return [name, value];
|
3049
|
-
}));
|
3050
|
-
}
|
3051
|
-
/** @internal */
|
3052
|
-
function submit() {
|
3053
|
-
const systemConfig = getSystem();
|
3054
|
-
const campaignId = systemConfig.campaignId;
|
3055
|
-
if (campaignId) {
|
3056
|
-
const formData$1 = get(formData);
|
3057
|
-
const identifyFormData$1 = get(identifyFormData);
|
3058
|
-
const values = formDataToEventValues(campaignId, formData$1);
|
3059
|
-
const identifyValues = formDataToIdentifyEventValues(identifyFormData$1);
|
3060
|
-
if (Object.keys(identifyValues).length > 0) {
|
3061
|
-
identifyValues['user_id'] = getVariables()?.[USER_ID_VARIABLE_NAME];
|
3062
|
-
}
|
3063
|
-
return { values, identifyValues };
|
3064
|
-
}
|
3065
|
-
return {};
|
3066
|
-
}
|
3067
|
-
|
3068
3181
|
/**
|
3069
3182
|
* モーダル(ポップアップ)のコンポーネントが利用するコードの管理
|
3070
3183
|
*/
|
@@ -11079,4 +11192,4 @@ class ImageBlock extends SvelteComponent {
|
|
11079
11192
|
}
|
11080
11193
|
}
|
11081
11194
|
|
11082
|
-
export { ACTION_HOOK_LABEL, Alignments, AnimationStyles, BackgroundSizes, Box, ClipPaths, CodeElement, Countdown, Cursors, DefaultEdgePosition, DefaultElasticity, DefaultFormButtonColor, DefaultFormIdentifyBooleanField, DefaultFormIdentifyTextField, DefaultListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListSeparator, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparatorNone, DefaultModalBreakPoint, DefaultModalPlacement, DefaultSlideButton, DefaultSlideNavigationButton, Directions, Elasticities, ElasticityStyle, EmbedElement, Flex, FlexDirections, FlexItem, Fonts, FormCheckBoxes, FormIdentifyBooleanFields, FormIdentifyChoices, FormIdentifyInput, FormIdentifyTextFieldPlaceholders, FormIdentifyTextFieldValidations, FormIdentifyTextFields, FormRadioButtons, FormRatingButtonsFace, FormRatingButtonsNumber, FormSelect, FormTextarea, Grid, GridItem, GridModalState, IconElement, ImageBlock, ImageElement, Justifies, KARTE_MODAL_ROOT, LAYOUT_COMPONENT_NAMES, LengthUnits, List, ListBackgroundTypes, ListDirections, ListItem, ListSeparatorTypes, MediaQueries, Modal, ModalPositions, MovieVimeoElement, MovieYouTubeElement, ObjectFits, OnClickOperationOptions, Overflows, PropTypes, Repeats, SYSTEM_FONT, Slide, SlideItem, State, StateItem, TextBlock, TextButtonBlock, TextButtonElement, TextDirections, TextElement, WritingModes, afterUpdate, applyCss, applyGlobalCss, beforeUpdate, close, closeAction, collection$1 as collection, create, createApp, createFog, destroy, destroyAction, ensureModalRoot, eventHandlers, finalize, formData, getActionRoot, getCssVariables, getEventHandlers, getEvents, getLogs, getState$1 as getState, getStates, getSystem, getVariables, hideOnScroll, hideOnTime, initialize, isOpened, listenLogger, loadActionTable, loadActionTableQuery, loadActionTableRow, loadActionTableRows, loadGlobalScript, loadGlobalStyle, loadStyle, logger, onChangeState, onClose, onCreate, onDestory, onDestroy, onMount, onScroll, onShow, onTime, resetEventHandlers, resetVariables, setEventHandlers, setSetting, setState$1 as setState, setVariables, show, showAction, showModal, showOnScroll, showOnTime, state, tick, variables, widget };
|
11195
|
+
export { ACTION_HOOK_LABEL, Alignments, AnimationStyles, BackgroundSizes, Box, ClipPaths, CodeElement, Countdown, Cursors, DefaultEdgePosition, DefaultElasticity, DefaultFormButtonColor, DefaultFormIdentifyBooleanField, DefaultFormIdentifyTextField, DefaultListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListSeparator, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparatorNone, DefaultModalBreakPoint, DefaultModalPlacement, DefaultSlideButton, DefaultSlideNavigationButton, Directions, Elasticities, ElasticityStyle, EmbedElement, Flex, FlexDirections, FlexItem, Fonts, FormCheckBoxes, FormIdentifyBooleanFields, FormIdentifyChoices, FormIdentifyInput, FormIdentifyTextFieldPlaceholders, FormIdentifyTextFieldValidations, FormIdentifyTextFields, FormRadioButtons, FormRatingButtonsFace, FormRatingButtonsNumber, FormSelect, FormTextarea, Grid, GridItem, GridModalState, IconElement, ImageBlock, ImageElement, Justifies, KARTE_MODAL_ROOT, LAYOUT_COMPONENT_NAMES, LengthUnits, List, ListBackgroundTypes, ListDirections, ListItem, ListSeparatorTypes, MediaQueries, Modal, ModalPositions, MovieVimeoElement, MovieYouTubeElement, ObjectFits, OnClickOperationOptions, Overflows, PropTypes, Repeats, SYSTEM_FONT, Slide, SlideItem, State, StateItem, TextBlock, TextButtonBlock, TextButtonElement, TextDirections, TextElement, WritingModes, addChoiceAnswer, addFreeAnswer, afterUpdate, applyCss, applyGlobalCss, beforeUpdate, close, closeAction, collection$1 as collection, create, createApp, createFog, destroy, destroyAction, ensureModalRoot, eventHandlers, finalize, formData, getActionRoot, getAnsweredQuestion, getAnsweredQuestionIds, getCssVariables, getEventHandlers, getEvents, getLogs, getState$1 as getState, getStates, getSystem, getVariables, hideOnScroll, hideOnTime, initialize, isOpened, listenLogger, loadActionTable, loadActionTableQuery, loadActionTableRow, loadActionTableRows, loadGlobalScript, loadGlobalStyle, loadStyle, logger, onChangeState, onClose, onCreate, onDestory, onDestroy, onMount, onScroll, onShow, onTime, removeAnswer, resetEventHandlers, resetVariables, sendAnswer, sendAnswers, setEventHandlers, setSetting, setState$1 as setState, setVariables, show, showAction, showModal, showOnScroll, showOnTime, state, tick, variables, widget };
|