@plaidev/karte-action-sdk 1.1.212 → 1.1.214

package/dist/index.es.js

@@ -1,6 +1,6 @@
 import { writable, get } from 'svelte/store';
 import { onMount as onMount$1, onDestroy as onDestroy$1, beforeUpdate as beforeUpdate$1, afterUpdate as afterUpdate$1, tick as tick$1, setContext, getContext, createEventDispatcher } from 'svelte';
-import { SvelteComponent, init, safe_not_equal, element, insert, noop, detach, component_subscribe, attr, create_slot, create_component, space, mount_component, update_slot_base, get_all_dirty_from_scope, get_slot_changes, transition_in, transition_out, destroy_component, append_styles, empty, group_outros, check_outros, null_to_empty, listen, assign, set_attributes, toggle_class, get_spread_update, prevent_default, is_function, add_render_callback, create_in_transition, binding_callbacks, set_style, svg_element, append, destroy_each, text, set_data, src_url_equal, HtmlTag, construct_svelte_component, subscribe } from 'svelte/internal';
+import { SvelteComponent, init, safe_not_equal, element, insert, noop, detach, component_subscribe, attr, create_slot, create_component, space, mount_component, update_slot_base, get_all_dirty_from_scope, get_slot_changes, transition_in, transition_out, destroy_component, append_styles, empty, group_outros, check_outros, null_to_empty, listen, assign, set_attributes, toggle_class, get_spread_update, prevent_default, is_function, add_render_callback, create_in_transition, binding_callbacks, set_style, svg_element, append, destroy_each, text, set_data, src_url_equal, set_store_value, run_all, HtmlTag, construct_svelte_component, subscribe } from 'svelte/internal';
 import { linear, elasticOut, cubicOut } from 'svelte/easing';
 
 /** @internal */
@@ -593,6 +593,52 @@ const DefaultModalBreakPoint = {
         elasticity: DefaultElasticity,
     },
 };
+const FormIdentifyTextFields = [
+    'email',
+    'phone',
+    'first_name',
+    'last_name',
+    'address',
+];
+/** @internal */
+const FormIdentifyTextFieldValidations = {
+    email: {
+        pattern: '^[A-Za-z0-9]{1}[A-Za-z0-9_.-]*@{1}[A-Za-z0-9_.-]{1,}.[A-Za-z0-9]{1,}$',
+        // gをつけない！test()を繰り返し呼び出した時に、テキストの途中から判定しようとしてしまう。
+        // https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test
+        flags: '',
+    },
+    phone: {
+        pattern: '^(0{1}\\d{9,10})$',
+        flags: '',
+    },
+    first_name: {
+        pattern: '',
+        flags: '',
+    },
+    last_name: {
+        pattern: '',
+        flags: '',
+    },
+    address: {
+        pattern: '',
+        flags: '',
+    },
+};
+/** @internal */
+const FormIdentifyTextFieldPlaceholders = {
+    email: 'メールアドレスを入力',
+    phone: '電話番号を入力',
+    first_name: '名前(名)を入力',
+    last_name: '名前(姓)を入力',
+    address: '住所',
+};
+/** @internal */
+const DefaultFormIdentifyTextField = 'email';
+/** @internal */
+const FormIdentifyBooleanFields = ['subscription', 'phone_subscribe'];
+/** @internal */
+const DefaultFormIdentifyBooleanField = 'subscription';
 
 /**
  * Store to handle action setting
@@ -991,6 +1037,12 @@ function resetVariables() {
  * @internal
  */
 const formData = writable({});
+/**
+ * Store for identify form data
+ *
+ * @internal
+ */
+const identifyFormData = writable({});
 
 /**
  * アクションのログの記録の管理
@@ -1740,11 +1792,7 @@ function createModal(App, options = {
     context: { api_key: '' },
 }) {
     let app = null;
-    const data = {
-        ...options.props,
-        ...options.variables,
-        ...getVariables(),
-    };
+    const data = getVariables();
     const actionProps = {
         send: options.send,
         publish: options.publish,
@@ -2050,21 +2098,14 @@ async function runScript$1(options = {
 }) {
     if (!options.onCreate)
         return;
-    let data = {
-        ...options.props,
-        ...options.variables,
-        ...getVariables(),
-    };
+    let data = getVariables();
     initialize({ send: options.send, initialState: data.initial_state });
     initActionTable(options.localVariablesQuery);
     const { success } = await setupActionTable(options.localVariablesQuery, data, data.api_key);
     if (!success)
         return;
     // Action Tableの取得結果を反映する
-    data = {
-        ...data,
-        ...getVariables(),
-    };
+    data = getVariables();
     const actionProps = {
         send: options.send,
         publish: options.publish,
@@ -2165,11 +2206,11 @@ function create(App, options = {
     karteTemplate: {},
     context: { api_key: '' },
 }) {
-    const data = {
+    setVariables({
         ...options.props,
         ...options.variables,
-        ...getVariables(),
-    };
+    });
+    const data = getVariables();
     const actionProps = {
         send: options.send,
         publish: options.publish,
@@ -2589,7 +2630,7 @@ function create_if_block$9(ctx) {
 	};
 }
 
-function create_fragment$y(ctx) {
+function create_fragment$A(ctx) {
 	let head;
 	let if_block = /*googleFontUrl*/ ctx[0] && create_if_block$9(ctx);
 
@@ -2625,7 +2666,7 @@ function create_fragment$y(ctx) {
 	};
 }
 
-function instance$y($$self, $$props, $$invalidate) {
+function instance$A($$self, $$props, $$invalidate) {
 	let $fonts;
 	component_subscribe($$self, fonts, $$value => $$invalidate(1, $fonts = $$value));
 	let googleFontUrl = '';
@@ -2654,13 +2695,13 @@ function instance$y($$self, $$props, $$invalidate) {
 class Header extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$y, create_fragment$y, safe_not_equal, {});
+		init(this, options, instance$A, create_fragment$A, safe_not_equal, {});
 	}
 }
 
 /* src/components/State.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$x(ctx) {
+function create_fragment$z(ctx) {
 	let header;
 	let t;
 	let current;
@@ -2719,7 +2760,7 @@ function create_fragment$x(ctx) {
 	};
 }
 
-function instance$x($$self, $$props, $$invalidate) {
+function instance$z($$self, $$props, $$invalidate) {
 	let { $$slots: slots = {}, $$scope } = $$props;
 
 	$$self.$$set = $$props => {
@@ -2732,13 +2773,13 @@ function instance$x($$self, $$props, $$invalidate) {
 class State extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$x, create_fragment$x, safe_not_equal, {});
+		init(this, options, instance$z, create_fragment$z, safe_not_equal, {});
 	}
 }
 
 /* src/components/StateItem.svelte generated by Svelte v3.53.1 */
 
-function add_css$t(target) {
+function add_css$v(target) {
 	append_styles(target, "svelte-1amihue", ".state-item.svelte-1amihue{position:absolute;display:none}");
 }
 
@@ -2805,7 +2846,7 @@ function create_if_block$8(ctx) {
 	};
 }
 
-function create_fragment$w(ctx) {
+function create_fragment$y(ctx) {
 	let if_block_anchor;
 	let current;
 	let if_block = /*$state*/ ctx[1] === /*path*/ ctx[0] && create_if_block$8(ctx);
@@ -2866,7 +2907,7 @@ function getStateItemContext() {
 	return getContext(STATE_ITEM_CONTEXT_KEY);
 }
 
-function instance$w($$self, $$props, $$invalidate) {
+function instance$y($$self, $$props, $$invalidate) {
 	let $state;
 	component_subscribe($$self, state, $$value => $$invalidate(1, $state = $$value));
 	let { $$slots: slots = {}, $$scope } = $$props;
@@ -2892,10 +2933,11 @@ function instance$w($$self, $$props, $$invalidate) {
 class StateItem extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$w, create_fragment$w, safe_not_equal, { path: 0 }, add_css$t);
+		init(this, options, instance$y, create_fragment$y, safe_not_equal, { path: 0 }, add_css$v);
 	}
 }
 
+const USER_ID_VARIABLE_NAME = '__karte_form_identify_user_id';
 function isEmpty(value) {
     if (Array.isArray(value)) {
         return value.length === 0;
@@ -2905,51 +2947,74 @@ function isEmpty(value) {
     }
 }
 /** @internal */
-function registerInput({ name, statePath, validator = () => true, initialValue, }) {
-    const writableValue = {
-        subscribe(run) {
-            return formData.subscribe(formData => {
-                run(formData[name]?.value);
-            });
-        },
-        set(value) {
-            formData.update(prev => ({
-                ...prev,
-                [name]: {
-                    statePath,
-                    value,
-                    isValid: validator(value),
-                },
-            }));
-        },
-        update(updater) {
-            formData.update(prev => {
-                const prevValue = prev[name]?.value;
-                return {
+function createInputRegisterer(formData) {
+    const registerInput = ({ name, statePath, validator = () => true, initialValue, }) => {
+        const writableValue = {
+            subscribe(run) {
+                return formData.subscribe(formData => {
+                    run(formData[name]?.value);
+                });
+            },
+            set(value) {
+                formData.update(prev => ({
                     ...prev,
                     [name]: {
                         statePath,
-                        value: updater(prevValue),
-                        isValid: validator(prevValue),
+                        value,
+                        isValid: validator(value),
                     },
-                };
-            });
-        },
+                }));
+            },
+            update(updater) {
+                formData.update(prev => {
+                    const prevValue = prev[name]?.value;
+                    if (prevValue === undefined)
+                        return prev;
+                    const value = updater(prevValue);
+                    return {
+                        ...prev,
+                        [name]: {
+                            statePath,
+                            value,
+                            isValid: validator(value),
+                        },
+                    };
+                });
+            },
+        };
+        const readableIsValid = {
+            subscribe(run) {
+                return formData.subscribe(formData => {
+                    run(formData[name]?.isValid);
+                });
+            },
+        };
+        if (isEmpty(get(writableValue))) {
+            writableValue.set(initialValue);
+        }
+        return {
+            value: writableValue,
+            isValid: readableIsValid,
+        };
     };
-    if (isEmpty(get(writableValue))) {
-        writableValue.set(initialValue);
-    }
-    return writableValue;
+    return registerInput;
 }
 /** @internal */
-const getValuesAreValidReader = statePath => ({
+const registerInput = createInputRegisterer(formData);
+/** @internal */
+const registerIdentifyInput = createInputRegisterer(identifyFormData);
+function validateFormData(formData, statePath) {
+    return Object.entries(formData)
+        .filter(([_, { statePath: s }]) => s === statePath) // eslint-disable-line @typescript-eslint/no-unused-vars
+        .every(([_, { isValid }]) => isValid); // eslint-disable-line @typescript-eslint/no-unused-vars
+}
+/** @internal */
+const getValuesAreValidReadable = statePath => ({
     subscribe(callback) {
-        return formData.subscribe(formData => {
-            const valuesAreValid = Object.entries(formData)
-                .filter(([_, { statePath: s }]) => s === statePath) // eslint-disable-line @typescript-eslint/no-unused-vars
-                .every(([_, { isValid }]) => isValid); // eslint-disable-line @typescript-eslint/no-unused-vars
+        return formData.subscribe(formData => identifyFormData.subscribe(identifyFormData => {
+            const valuesAreValid = validateFormData(formData, statePath) && validateFormData(identifyFormData, statePath);
             callback(valuesAreValid);
-        });
+        }));
     },
 });
 function formDataToEventValues(campaignId, formData) {
@@ -2977,14 +3042,25 @@ function formDataToEventValues(campaignId, formData) {
         },
     };
 }
+function formDataToIdentifyEventValues(formData) {
+    return Object.fromEntries(Object.entries(formData).map(([name, dataItem]) => {
+        const value = dataItem.value;
+        return [name, value];
+    }));
+}
 /** @internal */
 function submit() {
     const systemConfig = getSystem();
     const campaignId = systemConfig.campaignId;
     if (campaignId) {
         const formData$1 = get(formData);
+        const identifyFormData$1 = get(identifyFormData);
         const values = formDataToEventValues(campaignId, formData$1);
-        return values;
+        const identifyValues = formDataToIdentifyEventValues(identifyFormData$1);
+        if (Object.keys(identifyValues).length > 0) {
+            identifyValues['user_id'] = getVariables()?.[USER_ID_VARIABLE_NAME];
+        }
+        return { values, identifyValues };
     }
     return {};
 }
@@ -3043,8 +3119,11 @@ const runScript = (handlerName) => () => {
 };
 /** @internal */
 const submitForm = (to) => () => {
-    const values = submit();
+    const { values, identifyValues } = submit();
     send_event('_answer_question', values);
+    if (Object.keys(identifyValues).length > 0) {
+        send_event('identify', identifyValues);
+    }
     _moveTo(to);
 };
 /** @internal */
@@ -3160,7 +3239,7 @@ function customAnimation(node, { transform, animationStyle, delay = 0, duration
 
 /* src/components/BackgroundOverlay.svelte generated by Svelte v3.53.1 */
 
-function add_css$s(target) {
+function add_css$u(target) {
 	append_styles(target, "svelte-g6ucc2", ".background.svelte-g6ucc2{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.3);z-index:2147483646}");
 }
 
@@ -3197,7 +3276,7 @@ function create_if_block$7(ctx) {
 	};
 }
 
-function create_fragment$v(ctx) {
+function create_fragment$x(ctx) {
 	let if_block_anchor;
 	let if_block = /*backgroundOverlay*/ ctx[0] && create_if_block$7(ctx);
 
@@ -3233,7 +3312,7 @@ function create_fragment$v(ctx) {
 	};
 }
 
-function instance$v($$self, $$props, $$invalidate) {
+function instance$x($$self, $$props, $$invalidate) {
 	let { backgroundOverlay = false } = $$props;
 	let { class: className = undefined } = $$props;
 	const dispatch = createEventDispatcher();
@@ -3250,7 +3329,7 @@ function instance$v($$self, $$props, $$invalidate) {
 class BackgroundOverlay extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$v, create_fragment$v, safe_not_equal, { backgroundOverlay: 0, class: 1 }, add_css$s);
+		init(this, options, instance$x, create_fragment$x, safe_not_equal, { backgroundOverlay: 0, class: 1 }, add_css$u);
 	}
 }
 
@@ -3290,8 +3369,8 @@ function checkStopPropagation(eventName, handler) {
 
 /* src/components/Button.svelte generated by Svelte v3.53.1 */
 
-function add_css$r(target) {
-	append_styles(target, "svelte-1dtbrzj", ".button.svelte-1dtbrzj{display:block;text-decoration:none;color:inherit;border:none;background:none;margin:0;padding:0}.button.svelte-1dtbrzj:link,.button.svelte-1dtbrzj:visited,.button.svelte-1dtbrzj:active,.button.svelte-1dtbrzj:hover{color:inherit}");
+function add_css$t(target) {
+	append_styles(target, "svelte-1kmu8zp", ".button.svelte-1kmu8zp{display:block;text-decoration:none;color:inherit;border:none;background:none;margin:0;padding:0}.button.svelte-1kmu8zp:link,.button.svelte-1kmu8zp:visited,.button.svelte-1kmu8zp:active,.button.svelte-1kmu8zp:hover{color:inherit}");
 }
 
 // (50:0) {:else}
@@ -3320,7 +3399,7 @@ function create_else_block$4(ctx) {
 			button = element("button");
 			if (default_slot) default_slot.c();
 			set_attributes(button, button_data);
-			toggle_class(button, "svelte-1dtbrzj", true);
+			toggle_class(button, "svelte-1kmu8zp", true);
 		},
 		m(target, anchor) {
 			insert(target, button, anchor);
@@ -3359,7 +3438,7 @@ function create_else_block$4(ctx) {
 				dataAttrStopPropagation('click')
 			]));
 
-			toggle_class(button, "svelte-1dtbrzj", true);
+			toggle_class(button, "svelte-1kmu8zp", true);
 		},
 		i(local) {
 			if (current) return;
@@ -3390,7 +3469,7 @@ function create_if_block_2$1(ctx) {
 		c() {
 			div = element("div");
 			if (default_slot) default_slot.c();
-			attr(div, "class", "" + (null_to_empty(BUTTON_CLASS) + " svelte-1dtbrzj"));
+			attr(div, "class", "" + (null_to_empty(BUTTON_CLASS) + " svelte-1kmu8zp"));
 			attr(div, "style", /*style*/ ctx[1]);
 		},
 		m(target, anchor) {
@@ -3474,7 +3553,7 @@ function create_if_block_1$2(ctx) {
 			a = element("a");
 			if (default_slot) default_slot.c();
 			set_attributes(a, a_data);
-			toggle_class(a, "svelte-1dtbrzj", true);
+			toggle_class(a, "svelte-1kmu8zp", true);
 		},
 		m(target, anchor) {
 			insert(target, a, anchor);
@@ -3516,7 +3595,7 @@ function create_if_block_1$2(ctx) {
 				dataAttrStopPropagation('click')
 			]));
 
-			toggle_class(a, "svelte-1dtbrzj", true);
+			toggle_class(a, "svelte-1kmu8zp", true);
 		},
 		i(local) {
 			if (current) return;
@@ -3547,7 +3626,7 @@ function create_if_block$6(ctx) {
 		c() {
 			div = element("div");
 			if (default_slot) default_slot.c();
-			attr(div, "class", "" + (BUTTON_CLASS + " _disabled" + " svelte-1dtbrzj"));
+			attr(div, "class", "" + (BUTTON_CLASS + " _disabled" + " svelte-1kmu8zp"));
 			attr(div, "style", /*style*/ ctx[1]);
 		},
 		m(target, anchor) {
@@ -3595,7 +3674,7 @@ function create_if_block$6(ctx) {
 	};
 }
 
-function create_fragment$u(ctx) {
+function create_fragment$w(ctx) {
 	let current_block_type_index;
 	let if_block;
 	let if_block_anchor;
@@ -3668,7 +3747,7 @@ function create_fragment$u(ctx) {
 
 const BUTTON_CLASS = 'button';
 
-function instance$u($$self, $$props, $$invalidate) {
+function instance$w($$self, $$props, $$invalidate) {
 	let disabled;
 	let $valuesAreValid;
 	let { $$slots: slots = {}, $$scope } = $$props;
@@ -3686,7 +3765,7 @@ function instance$u($$self, $$props, $$invalidate) {
 	}
 
 	const { path: statePath } = getStateItemContext() ?? { path: '/' };
-	const valuesAreValid = getValuesAreValidReader(statePath);
+	const valuesAreValid = getValuesAreValidReadable(statePath);
 	component_subscribe($$self, valuesAreValid, value => $$invalidate(7, $valuesAreValid = value));
 
 	$$self.$$set = $$props => {
@@ -3734,8 +3813,8 @@ class Button extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$u,
-			create_fragment$u,
+			instance$w,
+			create_fragment$w,
 			safe_not_equal,
 			{
 				onClick: 0,
@@ -3743,14 +3822,14 @@ class Button extends SvelteComponent {
 				eventValue: 6,
 				style: 1
 			},
-			add_css$r
+			add_css$t
 		);
 	}
 }
 
 /* src/components/Modal.svelte generated by Svelte v3.53.1 */
 
-function add_css$q(target) {
+function add_css$s(target) {
 	append_styles(target, "svelte-fsihgx", ".modal.svelte-fsihgx{position:fixed;box-sizing:border-box;z-index:2147483647;display:flex}.modal.svelte-fsihgx > .button{flex:auto;display:flex}.close.svelte-fsihgx{position:absolute;top:0;right:0}.close.svelte-fsihgx > .button{position:absolute;display:flex;justify-content:center;align-items:center;background-color:transparent;border:none;cursor:pointer;padding:0;transition:all 0.25s}.close.svelte-fsihgx > .button:hover{transform:rotate(90deg)}.modal-content.svelte-fsihgx{flex:auto;display:flex;justify-content:center;align-items:center;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}@media screen and (min-width: 641px){.modal-bp.svelte-fsihgx{height:var(--modal-bp-height-pc) !important;width:var(--modal-bp-width-pc) !important;top:var(--modal-bp-top-pc) !important;left:var(--modal-bp-left-pc) !important;bottom:var(--modal-bp-bottom-pc) !important;right:var(--modal-bp-right-pc) !important;transform:var(--modal-bp-transform-pc) !important;margin:var(--modal-bp-margin-pc) !important}.background-bp-pc{display:block}.background-bp-sp{display:none}}@media screen and (max-width: 640px){.modal-bp.svelte-fsihgx{height:var(--modal-bp-height-sp) !important;width:var(--modal-bp-width-sp) !important;top:var(--modal-bp-top-sp) !important;left:var(--modal-bp-left-sp) !important;bottom:var(--modal-bp-bottom-sp) !important;right:var(--modal-bp-right-sp) !important;transform:var(--modal-bp-transform-sp) !important;margin:var(--modal-bp-margin-sp) !important}.background-bp-pc{display:none}.background-bp-sp{display:block}}");
 }
 
@@ -4145,7 +4224,7 @@ function create_default_slot$6(ctx) {
 	};
 }
 
-function create_fragment$t(ctx) {
+function create_fragment$v(ctx) {
 	let show_if;
 	let current_block_type_index;
 	let if_block0;
@@ -4263,7 +4342,7 @@ function create_fragment$t(ctx) {
 	};
 }
 
-function instance$t($$self, $$props, $$invalidate) {
+function instance$v($$self, $$props, $$invalidate) {
 	let close;
 	let closable;
 	let backgroundClick;
@@ -4566,8 +4645,8 @@ class Modal extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$t,
-			create_fragment$t,
+			instance$v,
+			create_fragment$v,
 			safe_not_equal,
 			{
 				onClick: 0,
@@ -4585,7 +4664,7 @@ class Modal extends SvelteComponent {
 				closeButtonColor: 9,
 				_closeStyle: 10
 			},
-			add_css$q,
+			add_css$s,
 			[-1, -1]
 		);
 	}
@@ -4593,7 +4672,7 @@ class Modal extends SvelteComponent {
 
 /* src/components/Grid.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$s(ctx) {
+function create_fragment$u(ctx) {
 	let div;
 	let current;
 	const default_slot_template = /*#slots*/ ctx[8].default;
@@ -4651,7 +4730,7 @@ function create_fragment$s(ctx) {
 	};
 }
 
-function instance$s($$self, $$props, $$invalidate) {
+function instance$u($$self, $$props, $$invalidate) {
 	let _style;
 	let { $$slots: slots = {}, $$scope } = $$props;
 	let { width = '512px' } = $$props;
@@ -4696,7 +4775,7 @@ class Grid extends SvelteComponent {
 	constructor(options) {
 		super();
 
-		init(this, options, instance$s, create_fragment$s, safe_not_equal, {
+		init(this, options, instance$u, create_fragment$u, safe_not_equal, {
 			width: 1,
 			height: 2,
 			rows: 3,
@@ -4709,11 +4788,11 @@ class Grid extends SvelteComponent {
 
 /* src/components/GridItem.svelte generated by Svelte v3.53.1 */
 
-function add_css$p(target) {
+function add_css$r(target) {
 	append_styles(target, "svelte-1cryhmb", ".grid-item.svelte-1cryhmb{word-break:break-all;position:relative}.grid-item-inner.svelte-1cryhmb{position:absolute;inset:0}");
 }
 
-function create_fragment$r(ctx) {
+function create_fragment$t(ctx) {
 	let div1;
 	let div0;
 	let current;
@@ -4787,7 +4866,7 @@ function create_fragment$r(ctx) {
 
 const GRID_ITEM_CONTEXT_KEY = 'GRID_ITEM';
 
-function instance$r($$self, $$props, $$invalidate) {
+function instance$t($$self, $$props, $$invalidate) {
 	let _style;
 	let { $$slots: slots = {}, $$scope } = $$props;
 	let { x1 } = $$props;
@@ -4836,8 +4915,8 @@ class GridItem extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$r,
-			create_fragment$r,
+			instance$t,
+			create_fragment$t,
 			safe_not_equal,
 			{
 				x1: 2,
@@ -4848,7 +4927,7 @@ class GridItem extends SvelteComponent {
 				background: 7,
 				gridItemId: 0
 			},
-			add_css$p
+			add_css$r
 		);
 	}
 }
@@ -4944,7 +5023,7 @@ function create_each_block$6(ctx) {
 	};
 }
 
-function create_fragment$q(ctx) {
+function create_fragment$s(ctx) {
 	let each_1_anchor;
 	let each_value = /*items*/ ctx[0];
 	let each_blocks = [];
@@ -5003,7 +5082,7 @@ function create_fragment$q(ctx) {
 
 const regexp = /(\r?\n)/;
 
-function instance$q($$self, $$props, $$invalidate) {
+function instance$s($$self, $$props, $$invalidate) {
 	let items;
 	let { text = 'サンプルSample' } = $$props;
 
@@ -5024,13 +5103,13 @@ function instance$q($$self, $$props, $$invalidate) {
 class RenderText extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$q, create_fragment$q, safe_not_equal, { text: 1 });
+		init(this, options, instance$s, create_fragment$s, safe_not_equal, { text: 1 });
 	}
 }
 
 /* src/components/TextElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$o(target) {
+function add_css$q(target) {
 	append_styles(target, "svelte-vz6867", ".text-element-wrapper.svelte-vz6867.svelte-vz6867{position:relative;height:100%}.text-element.svelte-vz6867.svelte-vz6867{display:flex;position:relative;width:100%;height:100%;box-sizing:border-box;white-space:pre-wrap;margin:0px;padding:0px;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden;font-size:12px;line-height:1.5}.text-link-element.svelte-vz6867.svelte-vz6867{text-decoration:none;color:inherit}.text-element-inner.svelte-vz6867.svelte-vz6867{width:100%;height:auto}.text-direction-vertical.svelte-vz6867.svelte-vz6867{writing-mode:vertical-rl}.text-direction-vertical.svelte-vz6867 .text-element-inner.svelte-vz6867{width:auto;height:100%}.tooltip.svelte-vz6867.svelte-vz6867{display:none;position:absolute;bottom:-40px;left:50%;transform:translateX(-50%);color:#fff;background-color:#3d4948;white-space:nowrap;padding:4px 8px 4px 8px;border-radius:4px;font-size:12px;z-index:2147483647}.tooltip.svelte-vz6867.svelte-vz6867:before{content:'';position:absolute;top:-13px;left:50%;margin-left:-7px;border:7px solid transparent;border-bottom:7px solid #3d4948}.tooltip.show.svelte-vz6867.svelte-vz6867{display:block}.tooltip-error.svelte-vz6867.svelte-vz6867{background-color:#c00}.tooltip-error.svelte-vz6867.svelte-vz6867:before{border-bottom:7px solid #c00}");
 }
 
@@ -5174,7 +5253,7 @@ function create_if_block$3(ctx) {
 	};
 }
 
-function create_fragment$p(ctx) {
+function create_fragment$r(ctx) {
 	let div;
 	let current_block_type_index;
 	let if_block;
@@ -5244,7 +5323,7 @@ function create_fragment$p(ctx) {
 	};
 }
 
-function instance$p($$self, $$props, $$invalidate) {
+function instance$r($$self, $$props, $$invalidate) {
 	let style;
 	let { text = 'テキストのコンテンツ' } = $$props;
 	let { font = SYSTEM_FONT } = $$props;
@@ -5340,8 +5419,8 @@ class TextElement extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$p,
-			create_fragment$p,
+			instance$r,
+			create_fragment$r,
 			safe_not_equal,
 			{
 				text: 0,
@@ -5352,14 +5431,14 @@ class TextElement extends SvelteComponent {
 				enableCopy: 2,
 				eventName: 10
 			},
-			add_css$o
+			add_css$q
 		);
 	}
 }
 
 /* src/components/TextButtonElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$n(target) {
+function add_css$p(target) {
 	append_styles(target, "svelte-ujdxfc", ".text-button-element.svelte-ujdxfc{width:100%;height:100%}.text-button-element.svelte-ujdxfc > .button{display:flex;width:100%;height:100%;border:none;box-shadow:transparent;box-sizing:border-box;transition:box-shadow 0.2s;white-space:pre-wrap;overflow:hidden;color:#ffffff;font-size:14px;font-weight:bold;justify-content:center;align-items:center;padding:1px 6px 1px 6px;line-height:1.5;background-color:#33403e;border-radius:4px;cursor:pointer;border-width:0px;border-style:solid;border-color:#000000}.text-button-element.svelte-ujdxfc > .button._disabled{cursor:not-allowed !important;opacity:0.2}.text-button-element.svelte-ujdxfc > .button:not(._disabled):active{box-shadow:inset 0 0 100px 100px rgba(0, 0, 0, 0.3)}.text-button-element.svelte-ujdxfc > .button:not(._disabled):hover{box-shadow:inset 0 0 100px 100px rgba(255, 255, 255, 0.3)}");
 }
 
@@ -5397,7 +5476,7 @@ function create_default_slot$5(ctx) {
 	};
 }
 
-function create_fragment$o(ctx) {
+function create_fragment$q(ctx) {
 	let div;
 	let button;
 	let current;
@@ -5451,7 +5530,7 @@ function create_fragment$o(ctx) {
 	};
 }
 
-function instance$o($$self, $$props, $$invalidate) {
+function instance$q($$self, $$props, $$invalidate) {
 	let style;
 	let { text = 'ボタンのラベル' } = $$props;
 	let { onClick = { operation: 'none', args: [] } } = $$props;
@@ -5489,8 +5568,8 @@ class TextButtonElement extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$o,
-			create_fragment$o,
+			instance$q,
+			create_fragment$q,
 			safe_not_equal,
 			{
 				text: 0,
@@ -5500,14 +5579,14 @@ class TextButtonElement extends SvelteComponent {
 				_buttonStyle: 5,
 				_style: 6
 			},
-			add_css$n
+			add_css$p
 		);
 	}
 }
 
 /* src/components/ImageElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$m(target) {
+function add_css$o(target) {
 	append_styles(target, "svelte-1alkh1m", ".image-element.svelte-1alkh1m{width:100%;height:100%;max-width:100%;max-height:100%;box-sizing:border-box}.image-element.svelte-1alkh1m > .button{display:flex;position:relative;width:100%;height:100%;max-width:100%;max-height:100%;justify-content:center;align-items:center;white-space:nowrap;box-sizing:border-box;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}.image-element.svelte-1alkh1m > .button._disabled{cursor:not-allowed !important;opacity:0.2}.image-element.transport.svelte-1alkh1m > .button:not(._disabled):hover,.image-element.transport.svelte-1alkh1m > .button:not(._disabled):focus{opacity:0.75;box-shadow:0 5px 16px rgba(0, 0, 0, 0.1), 0 8px 28px rgba(0, 0, 0, 0.16)}.image.svelte-1alkh1m{width:100%;height:100%}");
 }
 
@@ -5562,7 +5641,7 @@ function create_default_slot$4(ctx) {
 	};
 }
 
-function create_fragment$n(ctx) {
+function create_fragment$p(ctx) {
 	let div;
 	let button;
 	let div_class_value;
@@ -5621,7 +5700,7 @@ function create_fragment$n(ctx) {
 	};
 }
 
-function instance$n($$self, $$props, $$invalidate) {
+function instance$p($$self, $$props, $$invalidate) {
 	let { src = '' } = $$props;
 	let { alt = '画像の説明' } = $$props;
 	let { transport = false } = $$props;
@@ -5652,8 +5731,8 @@ class ImageElement extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$n,
-			create_fragment$n,
+			instance$p,
+			create_fragment$p,
 			safe_not_equal,
 			{
 				src: 0,
@@ -5665,18 +5744,18 @@ class ImageElement extends SvelteComponent {
 				_imageStyle: 6,
 				_style: 7
 			},
-			add_css$m
+			add_css$o
 		);
 	}
 }
 
 /* src/components/List.svelte generated by Svelte v3.53.1 */
 
-function add_css$l(target) {
+function add_css$n(target) {
 	append_styles(target, "svelte-1t8r9z", ".list.svelte-1t8r9z{display:flex;width:100%;height:100%;overflow:hidden;border-width:0px;border-style:solid;border-color:#000000}");
 }
 
-function create_fragment$m(ctx) {
+function create_fragment$o(ctx) {
 	let div;
 	let current;
 	const default_slot_template = /*#slots*/ ctx[6].default;
@@ -5736,7 +5815,7 @@ function create_fragment$m(ctx) {
 
 const LIST_CONTEXT_KEY = Symbol();
 
-function instance$m($$self, $$props, $$invalidate) {
+function instance$o($$self, $$props, $$invalidate) {
 	let style;
 	let { $$slots: slots = {}, $$scope } = $$props;
 	let { direction = 'vertical' } = $$props;
@@ -5803,8 +5882,8 @@ class List extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$m,
-			create_fragment$m,
+			instance$o,
+			create_fragment$o,
 			safe_not_equal,
 			{
 				direction: 1,
@@ -5812,14 +5891,14 @@ class List extends SvelteComponent {
 				background: 3,
 				_style: 4
 			},
-			add_css$l
+			add_css$n
 		);
 	}
 }
 
 /* src/components/ListItem.svelte generated by Svelte v3.53.1 */
 
-function add_css$k(target) {
+function add_css$m(target) {
 	append_styles(target, "svelte-1lbw8v2", ".list-item.svelte-1lbw8v2{flex:auto;box-sizing:border-box;min-width:0;min-height:0;position:relative}.list-item.svelte-1lbw8v2 > .button{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}");
 }
 
@@ -5871,7 +5950,7 @@ function create_default_slot$3(ctx) {
 	};
 }
 
-function create_fragment$l(ctx) {
+function create_fragment$n(ctx) {
 	let div;
 	let button;
 	let current;
@@ -5930,7 +6009,7 @@ function create_fragment$l(ctx) {
 	};
 }
 
-function instance$l($$self, $$props, $$invalidate) {
+function instance$n($$self, $$props, $$invalidate) {
 	let listItemStyle;
 	let { $$slots: slots = {}, $$scope } = $$props;
 	const { separator, background, direction, registerItem, unregisterItem } = getContext(LIST_CONTEXT_KEY);
@@ -6009,17 +6088,17 @@ function instance$l($$self, $$props, $$invalidate) {
 class ListItem extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$l, create_fragment$l, safe_not_equal, { onClick: 0, clickEventName: 1, _style: 2 }, add_css$k);
+		init(this, options, instance$n, create_fragment$n, safe_not_equal, { onClick: 0, clickEventName: 1, _style: 2 }, add_css$m);
 	}
 }
 
 /* src/components/EmbedElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$j(target) {
+function add_css$l(target) {
 	append_styles(target, "svelte-w6jkzh", ".embed.svelte-w6jkzh{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%}.embed.svelte-w6jkzh iframe{position:absolute;top:0;left:0;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}");
 }
 
-function create_fragment$k(ctx) {
+function create_fragment$m(ctx) {
 	let div;
 
 	return {
@@ -6046,7 +6125,7 @@ function create_fragment$k(ctx) {
 	};
 }
 
-function instance$k($$self, $$props, $$invalidate) {
+function instance$m($$self, $$props, $$invalidate) {
 	let { code } = $$props;
 	let { _style = '' } = $$props;
 
@@ -6061,17 +6140,17 @@ function instance$k($$self, $$props, $$invalidate) {
 class EmbedElement extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$k, create_fragment$k, safe_not_equal, { code: 0, _style: 1 }, add_css$j);
+		init(this, options, instance$m, create_fragment$m, safe_not_equal, { code: 0, _style: 1 }, add_css$l);
 	}
 }
 
 /* src/components/MovieYouTubeElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$i(target) {
+function add_css$k(target) {
 	append_styles(target, "svelte-ljxq7x", ".embed.svelte-ljxq7x{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}.embed.svelte-ljxq7x iframe{position:absolute;top:0;left:0;width:100%;height:100%}");
 }
 
-function create_fragment$j(ctx) {
+function create_fragment$l(ctx) {
 	let div1;
 	let div0;
 
@@ -6112,7 +6191,7 @@ function _setValue(obj, key, value) {
 	}
 }
 
-function instance$j($$self, $$props, $$invalidate) {
+function instance$l($$self, $$props, $$invalidate) {
 	let $system;
 	component_subscribe($$self, system, $$value => $$invalidate(31, $system = $$value));
 	let { videoId = 'wt0OjOeX-JA' } = $$props;
@@ -6383,8 +6462,8 @@ class MovieYouTubeElement extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$j,
-			create_fragment$j,
+			instance$l,
+			create_fragment$l,
 			safe_not_equal,
 			{
 				videoId: 2,
@@ -6413,7 +6492,7 @@ class MovieYouTubeElement extends SvelteComponent {
 				mute: 25,
 				_style: 0
 			},
-			add_css$i,
+			add_css$k,
 			[-1, -1]
 		);
 	}
@@ -6421,11 +6500,11 @@ class MovieYouTubeElement extends SvelteComponent {
 
 /* src/components/MovieVimeoElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$h(target) {
+function add_css$j(target) {
 	append_styles(target, "svelte-ljxq7x", ".embed.svelte-ljxq7x{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}.embed.svelte-ljxq7x iframe{position:absolute;top:0;left:0;width:100%;height:100%}");
 }
 
-function create_fragment$i(ctx) {
+function create_fragment$k(ctx) {
 	let div1;
 	let div0;
 
@@ -6456,7 +6535,7 @@ function create_fragment$i(ctx) {
 	};
 }
 
-function instance$i($$self, $$props, $$invalidate) {
+function instance$k($$self, $$props, $$invalidate) {
 	let $system;
 	component_subscribe($$self, system, $$value => $$invalidate(12, $system = $$value));
 	let { videoId = "201239468" } = $$props;
@@ -6599,8 +6678,8 @@ class MovieVimeoElement extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$i,
-			create_fragment$i,
+			instance$k,
+			create_fragment$k,
 			safe_not_equal,
 			{
 				videoId: 2,
@@ -6610,18 +6689,18 @@ class MovieVimeoElement extends SvelteComponent {
 				mute: 6,
 				_style: 0
 			},
-			add_css$h
+			add_css$j
 		);
 	}
 }
 
 /* src/components/FormTextarea.svelte generated by Svelte v3.53.1 */
 
-function add_css$g(target) {
+function add_css$i(target) {
 	append_styles(target, "svelte-1fjy5oo", ".textarea-wrapper.svelte-1fjy5oo{display:flex;align-items:center;width:100%;height:100%}.textarea.svelte-1fjy5oo{width:100%;height:100%;box-sizing:border-box;resize:none;appearance:none;background-color:#fff;border:solid 2px #ccc;border-radius:6px;padding:6px 10px 6px 10px;font-size:12px;line-height:1.5}.textarea.svelte-1fjy5oo::placeholder{color:var(--placeholder-color)}.textarea.svelte-1fjy5oo:focus{outline:none;border-width:var(--focus-border-width) !important;border-color:var(--focus-border-color) !important;border-style:var(--focus-border-style) !important}");
 }
 
-function create_fragment$h(ctx) {
+function create_fragment$j(ctx) {
 	let div;
 	let textarea;
 	let mounted;
@@ -6679,7 +6758,7 @@ function create_fragment$h(ctx) {
 	};
 }
 
-function instance$h($$self, $$props, $$invalidate) {
+function instance$j($$self, $$props, $$invalidate) {
 	let style;
 	let styleVariables;
 	let $value;
@@ -6693,7 +6772,7 @@ function instance$h($$self, $$props, $$invalidate) {
 	let { _placeholderStyle = 'color: #ccc;' } = $$props;
 	const { path: statePath } = getStateItemContext();
 
-	const value = registerInput({
+	const { value } = registerInput({
 		name,
 		statePath,
 		initialValue: '',
@@ -6767,8 +6846,8 @@ class FormTextarea extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$h,
-			create_fragment$h,
+			instance$j,
+			create_fragment$j,
 			safe_not_equal,
 			{
 				name: 7,
@@ -6780,14 +6859,14 @@ class FormTextarea extends SvelteComponent {
 				_textStyle: 11,
 				_placeholderStyle: 12
 			},
-			add_css$g
+			add_css$i
 		);
 	}
 }
 
 /* src/components/FormRadioButtons.svelte generated by Svelte v3.53.1 */
 
-function add_css$f(target) {
+function add_css$h(target) {
 	append_styles(target, "svelte-1ntb6j8", ".radio-buttons.svelte-1ntb6j8{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%}.radio-button.svelte-1ntb6j8{cursor:pointer;display:flex;align-items:center}.radio-button-input.svelte-1ntb6j8{appearance:none;margin:0;box-sizing:border-box;border-radius:var(--size);position:relative;width:var(--size);height:var(--size);border:solid calc(var(--size) / 3) var(--color-main);background-color:var(--color-sub);cursor:pointer;flex:none}.radio-button-input.svelte-1ntb6j8:checked{border:solid calc(var(--size) / 3) var(--color-main-active);background-color:var(--color-sub-active);box-shadow:0px 1px 8px 2px rgba(18,160,160,.08),0px 1px 4px -1px rgba(18,160,160,.24)}.radio-button-text.svelte-1ntb6j8{margin-left:0.5em}");
 }
 
@@ -6877,7 +6956,7 @@ function create_each_block$5(ctx) {
 	};
 }
 
-function create_fragment$g(ctx) {
+function create_fragment$i(ctx) {
 	let div;
 	let each_value = /*_options*/ ctx[4];
 	let each_blocks = [];
@@ -6941,7 +7020,7 @@ function create_fragment$g(ctx) {
 	};
 }
 
-function instance$g($$self, $$props, $$invalidate) {
+function instance$i($$self, $$props, $$invalidate) {
 	let _options;
 	let buttonStyle;
 	let _value;
@@ -6958,7 +7037,7 @@ function instance$g($$self, $$props, $$invalidate) {
 	let { buttonColorActive = { main: '#2aab9f', sub: '#fff' } } = $$props;
 	const { path: statePath } = getStateItemContext();
 
-	const value = registerInput({
+	const { value } = registerInput({
 		name,
 		statePath,
 		initialValue: [],
@@ -7041,8 +7120,8 @@ class FormRadioButtons extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$g,
-			create_fragment$g,
+			instance$i,
+			create_fragment$i,
 			safe_not_equal,
 			{
 				name: 0,
@@ -7055,14 +7134,14 @@ class FormRadioButtons extends SvelteComponent {
 				buttonColor: 13,
 				buttonColorActive: 14
 			},
-			add_css$f
+			add_css$h
 		);
 	}
 }
 
 /* src/components/FormSelect.svelte generated by Svelte v3.53.1 */
 
-function add_css$e(target) {
+function add_css$g(target) {
 	append_styles(target, "svelte-iejizj", ".select.svelte-iejizj{width:100%;height:100%}.select-select.svelte-iejizj{position:relative;appearance:none;width:100%;height:100%;cursor:pointer;background-color:#fff;border:solid 2px #ccc;border-radius:6px;padding:0 0 0 10px;font-size:12px;line-height:1.5}.select-select.svelte-iejizj:focus{outline:none;border-width:var(--focus-border-width) !important;border-color:var(--focus-border-color) !important;border-style:var(--focus-border-style) !important}.select-icon.svelte-iejizj{position:absolute;width:calc(var(--icon-size) / 1.41);height:calc(var(--icon-size) / 1.41);top:calc(50% - calc(var(--icon-size) / 4));right:calc(var(--icon-size) * 1.2);box-sizing:border-box;border-right:solid 2px var(--icon-color);border-top:solid 2px var(--icon-color);transform:translateY(-35.4%) rotate(135deg);pointer-events:none}");
 }
 
@@ -7172,7 +7251,7 @@ function create_each_block$4(ctx) {
 	};
 }
 
-function create_fragment$f(ctx) {
+function create_fragment$h(ctx) {
 	let div1;
 	let select;
 	let t;
@@ -7262,7 +7341,7 @@ function create_fragment$f(ctx) {
 	};
 }
 
-function instance$f($$self, $$props, $$invalidate) {
+function instance$h($$self, $$props, $$invalidate) {
 	let _options;
 	let style;
 	let styleVariables;
@@ -7281,7 +7360,7 @@ function instance$f($$self, $$props, $$invalidate) {
 	let { iconSize = '12px' } = $$props;
 	const { path: statePath } = getStateItemContext();
 
-	const value = registerInput({
+	const { value } = registerInput({
 		name,
 		statePath,
 		initialValue: [],
@@ -7378,8 +7457,8 @@ class FormSelect extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$f,
-			create_fragment$f,
+			instance$h,
+			create_fragment$h,
 			safe_not_equal,
 			{
 				name: 7,
@@ -7394,14 +7473,14 @@ class FormSelect extends SvelteComponent {
 				iconColor: 15,
 				iconSize: 16
 			},
-			add_css$e
+			add_css$g
 		);
 	}
 }
 
 /* src/components/FormCheckBoxes.svelte generated by Svelte v3.53.1 */
 
-function add_css$d(target) {
+function add_css$f(target) {
 	append_styles(target, "svelte-2pz1us", ".check-boxes.svelte-2pz1us.svelte-2pz1us{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%;gap:0px}.check-box.svelte-2pz1us.svelte-2pz1us{display:flex;align-items:center;position:relative;cursor:pointer}.check-box-input.svelte-2pz1us.svelte-2pz1us{width:var(--size);height:var(--size);margin:0;position:absolute;appearance:none;cursor:pointer}.check-box-check.svelte-2pz1us.svelte-2pz1us{display:inline-flex;background-color:var(--color-main);width:var(--size);height:var(--size);border-radius:calc(var(--size) / 4);justify-content:center;align-items:center;flex:none}.check-box-icon.svelte-2pz1us.svelte-2pz1us{display:inline-block;--icon-size:calc(var(--size) * 3 / 4);width:var(--icon-size);height:var(--icon-size)}.check-box-icon.svelte-2pz1us.svelte-2pz1us:after{content:'';display:block;box-sizing:border-box;width:45%;height:91%;transform:translate(60%, -8%) rotate(45deg);border-style:none solid solid none;border-width:2px;border-color:var(--color-sub)}.check-box-check._checked.svelte-2pz1us.svelte-2pz1us{background-color:var(--color-main-active)}.check-box-check._checked.svelte-2pz1us .check-box-icon.svelte-2pz1us:after{border-color:var(--color-sub-active)}.check-box-text.svelte-2pz1us.svelte-2pz1us{margin-left:0.5em;color:#333;font-size:12px;line-height:1.5}");
 }
 
@@ -7507,7 +7586,7 @@ function create_each_block$3(ctx) {
 	};
 }
 
-function create_fragment$e(ctx) {
+function create_fragment$g(ctx) {
 	let div;
 	let each_value = /*_options*/ ctx[3];
 	let each_blocks = [];
@@ -7571,7 +7650,7 @@ function create_fragment$e(ctx) {
 	};
 }
 
-function instance$e($$self, $$props, $$invalidate) {
+function instance$g($$self, $$props, $$invalidate) {
 	let _options;
 	let styleVariables;
 	let isCheckedArray;
@@ -7588,7 +7667,7 @@ function instance$e($$self, $$props, $$invalidate) {
 	let { buttonColorActive = { main: '#2aab9f', sub: '#fff' } } = $$props;
 	const { path: statePath } = getStateItemContext();
 
-	const value = registerInput({
+	const { value } = registerInput({
 		name,
 		statePath,
 		initialValue: [],
@@ -7677,8 +7756,8 @@ class FormCheckBoxes extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$e,
-			create_fragment$e,
+			instance$g,
+			create_fragment$g,
 			safe_not_equal,
 			{
 				name: 0,
@@ -7691,14 +7770,14 @@ class FormCheckBoxes extends SvelteComponent {
 				buttonColor: 13,
 				buttonColorActive: 14
 			},
-			add_css$d
+			add_css$f
 		);
 	}
 }
 
 /* src/components/FormRatingButtonsNumber.svelte generated by Svelte v3.53.1 */
 
-function add_css$c(target) {
+function add_css$e(target) {
 	append_styles(target, "svelte-18pfy31", ".rating-buttons.svelte-18pfy31{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%}.rating-button.svelte-18pfy31{cursor:pointer;display:flex;justify-content:center;align-items:center;transition:background-color 0.2s, box-shadow 0.2s;appearance:none;background:none;border:none;margin:0;padding:0}");
 }
 
@@ -7755,7 +7834,7 @@ function create_each_block$2(ctx) {
 	};
 }
 
-function create_fragment$d(ctx) {
+function create_fragment$f(ctx) {
 	let div;
 	let each_value = [...Array(/*count*/ ctx[0]).keys()].map(func$1);
 	let each_blocks = [];
@@ -7816,7 +7895,7 @@ function create_fragment$d(ctx) {
 
 const func$1 = i => i + 1;
 
-function instance$d($$self, $$props, $$invalidate) {
+function instance$f($$self, $$props, $$invalidate) {
 	let _value;
 	let $value;
 	let { name = '' } = $$props;
@@ -7827,7 +7906,7 @@ function instance$d($$self, $$props, $$invalidate) {
 	let { buttonActiveStyle = 'color: #333; background-color: #2aab9f; box-shadow: 0px 8px 16px 0px rgba(0, 16, 14, 0.3);' } = $$props;
 	const { path: statePath } = getStateItemContext();
 
-	const value = registerInput({
+	const { value } = registerInput({
 		name,
 		statePath,
 		initialValue: [],
@@ -7892,8 +7971,8 @@ class FormRatingButtonsNumber extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$d,
-			create_fragment$d,
+			instance$f,
+			create_fragment$f,
 			safe_not_equal,
 			{
 				name: 5,
@@ -7903,14 +7982,14 @@ class FormRatingButtonsNumber extends SvelteComponent {
 				buttonStyle: 8,
 				buttonActiveStyle: 9
 			},
-			add_css$c
+			add_css$e
 		);
 	}
 }
 
 /* src/components/FormRatingButtonsFace.svelte generated by Svelte v3.53.1 */
 
-function add_css$b(target) {
+function add_css$d(target) {
 	append_styles(target, "svelte-1b5dvzw", ".rating-buttons.svelte-1b5dvzw{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%}.rating-button.svelte-1b5dvzw{appearance:none;background:none;border:none;margin:0;padding:0}.rating-button-image.svelte-1b5dvzw{cursor:pointer;user-select:none;-webkit-user-drag:none;width:100%;height:100%}.rating-button-image.svelte-1b5dvzw:not(._active){filter:grayscale(100%)}");
 }
 
@@ -7970,7 +8049,7 @@ function create_each_block$1(ctx) {
 	};
 }
 
-function create_fragment$c(ctx) {
+function create_fragment$e(ctx) {
 	let div;
 	let each_value = [...Array(count).keys()].reverse().map(func);
 	let each_blocks = [];
@@ -8032,7 +8111,7 @@ function create_fragment$c(ctx) {
 const count = 5;
 const func = i => i + 1;
 
-function instance$c($$self, $$props, $$invalidate) {
+function instance$e($$self, $$props, $$invalidate) {
 	let _value;
 	let buttonStyle;
 	let $value;
@@ -8050,7 +8129,7 @@ function instance$c($$self, $$props, $$invalidate) {
 
 	const { path: statePath } = getStateItemContext();
 
-	const value = registerInput({
+	const { value } = registerInput({
 		name,
 		statePath,
 		initialValue: [],
@@ -8088,7 +8167,439 @@ function instance$c($$self, $$props, $$invalidate) {
 class FormRatingButtonsFace extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$c, create_fragment$c, safe_not_equal, { name: 5, required: 6, size: 7 }, add_css$b);
+		init(this, options, instance$e, create_fragment$e, safe_not_equal, { name: 5, required: 6, size: 7 }, add_css$d);
+	}
+}
+
+/* src/components/FormIdentifyInput.svelte generated by Svelte v3.53.1 */
+
+function add_css$c(target) {
+	append_styles(target, "svelte-17a0wgl", ".input-wrapper.svelte-17a0wgl{display:flex;align-items:center;width:100%;height:100%}.input.svelte-17a0wgl{width:100%;height:100%;box-sizing:border-box;resize:none;appearance:none;background-color:#fff;border:solid 2px #ccc;border-radius:6px;padding:6px 10px 6px 10px;font-size:12px;line-height:1.5}.input.svelte-17a0wgl::placeholder{color:var(--placeholder-color)}.input.svelte-17a0wgl:focus{outline:none;border-width:var(--focus-border-width) !important;border-color:var(--focus-border-color) !important;border-style:var(--focus-border-style) !important}.input._error.svelte-17a0wgl{outline:none;border-width:var(--error-border-width) !important;border-color:var(--error-border-color) !important;border-style:var(--error-border-style) !important}");
+}
+
+function create_fragment$d(ctx) {
+	let div;
+	let input;
+	let input_class_value;
+	let mounted;
+	let dispose;
+
+	return {
+		c() {
+			div = element("div");
+			input = element("input");
+			attr(input, "class", input_class_value = "" + (null_to_empty(['input', /*$isValid*/ ctx[5] ? '' : '_error'].join(' ')) + " svelte-17a0wgl"));
+			attr(input, "type", "text");
+			input.value = /*$value*/ ctx[4];
+			input.required = /*required*/ ctx[0];
+			attr(input, "placeholder", /*placeholder*/ ctx[1]);
+			attr(input, "style", /*style*/ ctx[3]);
+			attr(div, "class", "input-wrapper svelte-17a0wgl");
+			attr(div, "style", /*styleVariables*/ ctx[2]);
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			append(div, input);
+
+			if (!mounted) {
+				dispose = listen(input, "input", /*stringInputHandler*/ ctx[8]);
+				mounted = true;
+			}
+		},
+		p(ctx, [dirty]) {
+			if (dirty & /*$isValid*/ 32 && input_class_value !== (input_class_value = "" + (null_to_empty(['input', /*$isValid*/ ctx[5] ? '' : '_error'].join(' ')) + " svelte-17a0wgl"))) {
+				attr(input, "class", input_class_value);
+			}
+
+			if (dirty & /*$value*/ 16 && input.value !== /*$value*/ ctx[4]) {
+				input.value = /*$value*/ ctx[4];
+			}
+
+			if (dirty & /*required*/ 1) {
+				input.required = /*required*/ ctx[0];
+			}
+
+			if (dirty & /*placeholder*/ 2) {
+				attr(input, "placeholder", /*placeholder*/ ctx[1]);
+			}
+
+			if (dirty & /*style*/ 8) {
+				attr(input, "style", /*style*/ ctx[3]);
+			}
+
+			if (dirty & /*styleVariables*/ 4) {
+				attr(div, "style", /*styleVariables*/ ctx[2]);
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (detaching) detach(div);
+			mounted = false;
+			dispose();
+		}
+	};
+}
+
+function instance$d($$self, $$props, $$invalidate) {
+	let style;
+	let styleVariables;
+	let $value;
+	let $isValid;
+	let { field = 'email' } = $$props;
+
+	let { validation = {
+		// FormIdentifyTextFieldValidations[DefaultFormIdentifyTextField]
+		pattern: '^[A-Za-z0-9]{1}[A-Za-z0-9_.-]*@{1}[A-Za-z0-9_.-]{1,}.[A-Za-z0-9]{1,}$',
+		// gをつけない！test()を繰り返し呼び出した時に、テキストの途中から判定しようとしてしまう。
+		// https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test
+		flags: ''
+	} } = $$props;
+
+	let { required = true } = $$props;
+	let { placeholder = 'メールアドレスを入力' } = $$props;
+	let { _style = '' } = $$props;
+	let { _focusStyle = 'border-width: 2px; border-color: #2aab9f; border-style: solid' } = $$props;
+	let { _errorStyle = 'border-width: 2px; border-color: #ff8726; border-style: solid' } = $$props;
+	let { font = SYSTEM_FONT } = $$props;
+	let { _textStyle = '' } = $$props;
+	let { _placeholderStyle = 'color: #ccc;' } = $$props;
+	const { path: statePath } = getStateItemContext();
+
+	const validationRegExp = (() => {
+		try {
+			return new RegExp(validation.pattern, validation.flags);
+		} catch(e) {
+			return undefined;
+		}
+	})();
+
+	const { value, isValid } = registerIdentifyInput({
+		name: field,
+		statePath,
+		initialValue: '',
+		validator(value) {
+			if (value.length > 0 && validationRegExp && validationRegExp.test(value)) {
+				return true;
+			} else if (!required && value === '') {
+				return true;
+			} else {
+				return false;
+			}
+		}
+	});
+
+	component_subscribe($$self, value, value => $$invalidate(4, $value = value));
+	component_subscribe($$self, isValid, value => $$invalidate(5, $isValid = value));
+
+	function stringInputHandler(event) {
+		set_store_value(value, $value = event.target.value, $value);
+	}
+
+	$$self.$$set = $$props => {
+		if ('field' in $$props) $$invalidate(9, field = $$props.field);
+		if ('validation' in $$props) $$invalidate(10, validation = $$props.validation);
+		if ('required' in $$props) $$invalidate(0, required = $$props.required);
+		if ('placeholder' in $$props) $$invalidate(1, placeholder = $$props.placeholder);
+		if ('_style' in $$props) $$invalidate(11, _style = $$props._style);
+		if ('_focusStyle' in $$props) $$invalidate(12, _focusStyle = $$props._focusStyle);
+		if ('_errorStyle' in $$props) $$invalidate(13, _errorStyle = $$props._errorStyle);
+		if ('font' in $$props) $$invalidate(14, font = $$props.font);
+		if ('_textStyle' in $$props) $$invalidate(15, _textStyle = $$props._textStyle);
+		if ('_placeholderStyle' in $$props) $$invalidate(16, _placeholderStyle = $$props._placeholderStyle);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*font*/ 16384) {
+			addFont(font);
+		}
+
+		if ($$self.$$.dirty & /*_style, _textStyle, font*/ 51200) {
+			$$invalidate(3, style = [..._style.split(';'), ..._textStyle.split(';'), `font-family:${font}`].join(';'));
+		}
+
+		if ($$self.$$.dirty & /*_focusStyle, _errorStyle, _placeholderStyle*/ 77824) {
+			$$invalidate(2, styleVariables = (() => {
+				const variables = {};
+				const focusStyleObj = parseStyle(_focusStyle);
+				const errorStyleObj = parseStyle(_errorStyle);
+				const placeholderStyle = parseStyle(_placeholderStyle);
+				if (focusStyleObj['border-width']) variables['--focus-border-width'] = focusStyleObj['border-width'];
+				if (focusStyleObj['border-color']) variables['--focus-border-color'] = focusStyleObj['border-color'];
+				if (focusStyleObj['border-style']) variables['--focus-border-style'] = focusStyleObj['border-style'];
+				if (errorStyleObj['border-width']) variables['--error-border-width'] = errorStyleObj['border-width'];
+				if (errorStyleObj['border-color']) variables['--error-border-color'] = errorStyleObj['border-color'];
+				if (errorStyleObj['border-style']) variables['--error-border-style'] = errorStyleObj['border-style'];
+				if (placeholderStyle.color) variables['--placeholder-color'] = placeholderStyle.color;
+				return stringifyStyleObj(variables);
+			})());
+		}
+	};
+
+	return [
+		required,
+		placeholder,
+		styleVariables,
+		style,
+		$value,
+		$isValid,
+		value,
+		isValid,
+		stringInputHandler,
+		field,
+		validation,
+		_style,
+		_focusStyle,
+		_errorStyle,
+		font,
+		_textStyle,
+		_placeholderStyle
+	];
+}
+
+class FormIdentifyInput extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(
+			this,
+			options,
+			instance$d,
+			create_fragment$d,
+			safe_not_equal,
+			{
+				field: 9,
+				validation: 10,
+				required: 0,
+				placeholder: 1,
+				_style: 11,
+				_focusStyle: 12,
+				_errorStyle: 13,
+				font: 14,
+				_textStyle: 15,
+				_placeholderStyle: 16
+			},
+			add_css$c
+		);
+	}
+}
+
+/* src/components/FormIdentifyChoices.svelte generated by Svelte v3.53.1 */
+
+function add_css$b(target) {
+	append_styles(target, "svelte-pzrwlo", ".radio-buttons.svelte-pzrwlo{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%}.radio-button.svelte-pzrwlo{cursor:pointer;display:flex;align-items:center}.radio-button-input.svelte-pzrwlo{appearance:none;margin:0;box-sizing:border-box;border-radius:var(--size);position:relative;width:var(--size);height:var(--size);border:solid calc(var(--size) / 3) var(--color-main);background-color:var(--color-sub);cursor:pointer;flex:none}.radio-button-input.svelte-pzrwlo:checked{border:solid calc(var(--size) / 3) var(--color-main-active);background-color:var(--color-sub-active);box-shadow:0px 1px 8px 2px rgba(18, 160, 160, 0.08), 0px 1px 4px -1px rgba(18, 160, 160, 0.24)}.radio-button-text.svelte-pzrwlo{margin-left:0.5em}");
+}
+
+function create_fragment$c(ctx) {
+	let div;
+	let label0;
+	let input0;
+	let input0_checked_value;
+	let t0;
+	let span0;
+	let t1;
+	let span0_style_value;
+	let t2;
+	let label1;
+	let input1;
+	let input1_checked_value;
+	let t3;
+	let span1;
+	let t4;
+	let span1_style_value;
+	let mounted;
+	let dispose;
+
+	return {
+		c() {
+			div = element("div");
+			label0 = element("label");
+			input0 = element("input");
+			t0 = space();
+			span0 = element("span");
+			t1 = text("はい");
+			t2 = space();
+			label1 = element("label");
+			input1 = element("input");
+			t3 = space();
+			span1 = element("span");
+			t4 = text("いいえ");
+			attr(input0, "type", "radio");
+			attr(input0, "class", "radio-button-input svelte-pzrwlo");
+			attr(input0, "style", /*buttonStyle*/ ctx[2]);
+			input0.checked = input0_checked_value = /*$value*/ ctx[3] === true;
+			attr(span0, "class", "radio-button-text svelte-pzrwlo");
+			attr(span0, "style", span0_style_value = `${/*_textStyle*/ ctx[1]} ${/*fontCss*/ ctx[4]}`);
+			attr(label0, "class", "radio-button svelte-pzrwlo");
+			attr(input1, "type", "radio");
+			attr(input1, "class", "radio-button-input svelte-pzrwlo");
+			attr(input1, "style", /*buttonStyle*/ ctx[2]);
+			input1.checked = input1_checked_value = /*$value*/ ctx[3] === false;
+			attr(span1, "class", "radio-button-text svelte-pzrwlo");
+			attr(span1, "style", span1_style_value = `${/*_textStyle*/ ctx[1]} ${/*fontCss*/ ctx[4]}`);
+			attr(label1, "class", "radio-button svelte-pzrwlo");
+			attr(div, "class", "radio-buttons svelte-pzrwlo");
+			attr(div, "style", /*_layoutStyle*/ ctx[0]);
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			append(div, label0);
+			append(label0, input0);
+			append(label0, t0);
+			append(label0, span0);
+			append(span0, t1);
+			append(div, t2);
+			append(div, label1);
+			append(label1, input1);
+			append(label1, t3);
+			append(label1, span1);
+			append(span1, t4);
+
+			if (!mounted) {
+				dispose = [
+					listen(input0, "change", /*change_handler*/ ctx[12]),
+					listen(input1, "change", /*change_handler_1*/ ctx[13])
+				];
+
+				mounted = true;
+			}
+		},
+		p(ctx, [dirty]) {
+			if (dirty & /*buttonStyle*/ 4) {
+				attr(input0, "style", /*buttonStyle*/ ctx[2]);
+			}
+
+			if (dirty & /*$value*/ 8 && input0_checked_value !== (input0_checked_value = /*$value*/ ctx[3] === true)) {
+				input0.checked = input0_checked_value;
+			}
+
+			if (dirty & /*_textStyle*/ 2 && span0_style_value !== (span0_style_value = `${/*_textStyle*/ ctx[1]} ${/*fontCss*/ ctx[4]}`)) {
+				attr(span0, "style", span0_style_value);
+			}
+
+			if (dirty & /*buttonStyle*/ 4) {
+				attr(input1, "style", /*buttonStyle*/ ctx[2]);
+			}
+
+			if (dirty & /*$value*/ 8 && input1_checked_value !== (input1_checked_value = /*$value*/ ctx[3] === false)) {
+				input1.checked = input1_checked_value;
+			}
+
+			if (dirty & /*_textStyle*/ 2 && span1_style_value !== (span1_style_value = `${/*_textStyle*/ ctx[1]} ${/*fontCss*/ ctx[4]}`)) {
+				attr(span1, "style", span1_style_value);
+			}
+
+			if (dirty & /*_layoutStyle*/ 1) {
+				attr(div, "style", /*_layoutStyle*/ ctx[0]);
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (detaching) detach(div);
+			mounted = false;
+			run_all(dispose);
+		}
+	};
+}
+
+function instance$c($$self, $$props, $$invalidate) {
+	let buttonStyle;
+	let $value;
+	let { field = 'subscription' } = $$props;
+	let { required = false } = $$props;
+	let { _layoutStyle = 'flex-direction: row; gap: 0px;' } = $$props;
+	let { font = SYSTEM_FONT } = $$props;
+	const fontCss = font ? 'font-family:' + font : '';
+	let { _textStyle = 'color: #333; font-size: 12px; line-height:1.5;' } = $$props;
+	let { buttonSize = '16px' } = $$props;
+	let { buttonColor = { main: '#f0f1f1', sub: '#f0f1f1' } } = $$props;
+	let { buttonColorActive = { main: '#2aab9f', sub: '#fff' } } = $$props;
+	const { path: statePath } = getStateItemContext();
+
+	const { value } = registerIdentifyInput({
+		name: field,
+		statePath,
+		initialValue: null,
+		validator(value) {
+			if (!required) return true;
+			return typeof value === 'boolean';
+		}
+	});
+
+	component_subscribe($$self, value, value => $$invalidate(3, $value = value));
+	const change_handler = () => value.set(true);
+	const change_handler_1 = () => value.set(false);
+
+	$$self.$$set = $$props => {
+		if ('field' in $$props) $$invalidate(6, field = $$props.field);
+		if ('required' in $$props) $$invalidate(7, required = $$props.required);
+		if ('_layoutStyle' in $$props) $$invalidate(0, _layoutStyle = $$props._layoutStyle);
+		if ('font' in $$props) $$invalidate(8, font = $$props.font);
+		if ('_textStyle' in $$props) $$invalidate(1, _textStyle = $$props._textStyle);
+		if ('buttonSize' in $$props) $$invalidate(9, buttonSize = $$props.buttonSize);
+		if ('buttonColor' in $$props) $$invalidate(10, buttonColor = $$props.buttonColor);
+		if ('buttonColorActive' in $$props) $$invalidate(11, buttonColorActive = $$props.buttonColorActive);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*font*/ 256) {
+			addFont(font);
+		}
+
+		if ($$self.$$.dirty & /*buttonColor, buttonColorActive, buttonSize*/ 3584) {
+			$$invalidate(2, buttonStyle = (() => {
+				return stringifyStyleObj({
+					'--color-main': buttonColor.main,
+					'--color-sub': buttonColor.sub,
+					'--color-main-active': buttonColorActive.main,
+					'--color-sub-active': buttonColorActive.sub,
+					'--size': buttonSize
+				});
+			})());
+		}
+	};
+
+	return [
+		_layoutStyle,
+		_textStyle,
+		buttonStyle,
+		$value,
+		fontCss,
+		value,
+		field,
+		required,
+		font,
+		buttonSize,
+		buttonColor,
+		buttonColorActive,
+		change_handler,
+		change_handler_1
+	];
+}
+
+class FormIdentifyChoices extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(
+			this,
+			options,
+			instance$c,
+			create_fragment$c,
+			safe_not_equal,
+			{
+				field: 6,
+				required: 7,
+				_layoutStyle: 0,
+				font: 8,
+				_textStyle: 1,
+				buttonSize: 9,
+				buttonColor: 10,
+				buttonColorActive: 11
+			},
+			add_css$b
+		);
 	}
 }
 
@@ -10555,4 +11066,4 @@ class ImageBlock extends SvelteComponent {
 	}
 }
 
-export { ACTION_HOOK_LABEL, Alignments, AnimationStyles, BackgroundSizes, Box, ClipPaths, CodeElement, Countdown, Cursors, DefaultEdgePosition, DefaultElasticity, DefaultFormButtonColor, DefaultListBackground, DefaultListBackgroundNone, DefaultListBackgroundStripe, DefaultListSeparator, DefaultListSeparatorBorder, DefaultListSeparatorGap, DefaultListSeparatorNone, DefaultModalBreakPoint, DefaultModalPlacement, DefaultSlideButton, DefaultSlideNavigationButton, Directions, Elasticities, ElasticityStyle, EmbedElement, Flex, FlexDirections, FlexItem, Fonts, FormCheckBoxes, 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 };
+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 };