@plaidev/karte-action-sdk 1.1.232-28654876.dc7c8de8 → 1.1.232-28663591.feead91d

package/dist/index.es.js

@@ -2880,7 +2880,7 @@ const LAYOUT_COMPONENT_NAMES = [
 
 /* src/components/Header.svelte generated by Svelte v3.53.1 */
 
-function create_if_block$d(ctx) {
+function create_if_block$b(ctx) {
 	let link;
 
 	return {
@@ -2906,7 +2906,7 @@ function create_if_block$d(ctx) {
 
 function create_fragment$15(ctx) {
 	let head;
-	let if_block = /*googleFontUrl*/ ctx[0] && create_if_block$d(ctx);
+	let if_block = /*googleFontUrl*/ ctx[0] && create_if_block$b(ctx);
 
 	return {
 		c() {
@@ -2922,7 +2922,7 @@ function create_fragment$15(ctx) {
 				if (if_block) {
 					if_block.p(ctx, dirty);
 				} else {
-					if_block = create_if_block$d(ctx);
+					if_block = create_if_block$b(ctx);
 					if_block.c();
 					if_block.m(head, null);
 				}
@@ -3053,12 +3053,12 @@ class State extends SvelteComponent {
 
 /* src/components/StateItem.svelte generated by Svelte v3.53.1 */
 
-function add_css$w(target) {
+function add_css$C(target) {
 	append_styles(target, "svelte-2qb6dm", ".state-item.svelte-2qb6dm{position:absolute;display:none}");
 }
 
 // (23:0) {#if $state === path}
-function create_if_block$c(ctx) {
+function create_if_block$a(ctx) {
 	let div;
 	let t;
 	let current;
@@ -3123,7 +3123,7 @@ function create_if_block$c(ctx) {
 function create_fragment$13(ctx) {
 	let if_block_anchor;
 	let current;
-	let if_block = /*$state*/ ctx[1] === /*path*/ ctx[0] && create_if_block$c(ctx);
+	let if_block = /*$state*/ ctx[1] === /*path*/ ctx[0] && create_if_block$a(ctx);
 
 	return {
 		c() {
@@ -3144,7 +3144,7 @@ function create_fragment$13(ctx) {
 						transition_in(if_block, 1);
 					}
 				} else {
-					if_block = create_if_block$c(ctx);
+					if_block = create_if_block$a(ctx);
 					if_block.c();
 					transition_in(if_block, 1);
 					if_block.m(if_block_anchor.parentNode, if_block_anchor);
@@ -3207,7 +3207,7 @@ function instance$13($$self, $$props, $$invalidate) {
 class StateItem extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$13, create_fragment$13, safe_not_equal, { path: 0 }, add_css$w);
+		init(this, options, instance$13, create_fragment$13, safe_not_equal, { path: 0 }, add_css$C);
 	}
 }
 
@@ -3392,12 +3392,12 @@ function customAnimation(node, { transforms, animationStyle, delay = 0, duration
 
 /* src/components/BackgroundOverlay.svelte generated by Svelte v3.53.1 */
 
-function add_css$v(target) {
+function add_css$B(target) {
 	append_styles(target, "svelte-1d4fta", ".background.svelte-1d4fta{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.3);z-index:2147483646}");
 }
 
 // (14:0) {#if backgroundOverlay}
-function create_if_block$b(ctx) {
+function create_if_block$9(ctx) {
 	let div;
 	let div_class_value;
 	let mounted;
@@ -3431,7 +3431,7 @@ function create_if_block$b(ctx) {
 
 function create_fragment$12(ctx) {
 	let if_block_anchor;
-	let if_block = /*backgroundOverlay*/ ctx[0] && create_if_block$b(ctx);
+	let if_block = /*backgroundOverlay*/ ctx[0] && create_if_block$9(ctx);
 
 	return {
 		c() {
@@ -3447,7 +3447,7 @@ function create_fragment$12(ctx) {
 				if (if_block) {
 					if_block.p(ctx, dirty);
 				} else {
-					if_block = create_if_block$b(ctx);
+					if_block = create_if_block$9(ctx);
 					if_block.c();
 					if_block.m(if_block_anchor.parentNode, if_block_anchor);
 				}
@@ -3482,7 +3482,7 @@ function instance$12($$self, $$props, $$invalidate) {
 class BackgroundOverlay extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$12, create_fragment$12, safe_not_equal, { backgroundOverlay: 0, class: 1 }, add_css$v);
+		init(this, options, instance$12, create_fragment$12, safe_not_equal, { backgroundOverlay: 0, class: 1 }, add_css$B);
 	}
 }
 
@@ -3522,7 +3522,7 @@ function checkStopPropagation(eventName, handler) {
 
 /* src/components/Button.svelte generated by Svelte v3.53.1 */
 
-function add_css$u(target) {
+function add_css$A(target) {
 	append_styles(target, "svelte-15k4deh", ".button.svelte-15k4deh{display:block;text-decoration:none;color:inherit;border:none;background:none;margin:0;padding:0}.button.svelte-15k4deh:link,.button.svelte-15k4deh:visited,.button.svelte-15k4deh:active,.button.svelte-15k4deh:hover{color:inherit}");
 }
 
@@ -3769,7 +3769,7 @@ function create_if_block_1$2(ctx) {
 }
 
 // (31:0) {#if disabled}
-function create_if_block$a(ctx) {
+function create_if_block$8(ctx) {
 	let div;
 	let current;
 	const default_slot_template = /*#slots*/ ctx[9].default;
@@ -3832,7 +3832,7 @@ function create_fragment$11(ctx) {
 	let if_block;
 	let if_block_anchor;
 	let current;
-	const if_block_creators = [create_if_block$a, create_if_block_1$2, create_if_block_2$1, create_else_block$4];
+	const if_block_creators = [create_if_block$8, create_if_block_1$2, create_if_block_2$1, create_else_block$4];
 	const if_blocks = [];
 
 	function select_block_type(ctx, dirty) {
@@ -3975,14 +3975,14 @@ let Button$1 = class Button extends SvelteComponent {
 				eventValue: 6,
 				style: 1
 			},
-			add_css$u
+			add_css$A
 		);
 	}
 };
 
 /* src/components/Modal.svelte generated by Svelte v3.53.1 */
 
-function add_css$t(target) {
+function add_css$z(target) {
 	append_styles(target, "svelte-1ijkyzl", ".modal.svelte-1ijkyzl{position:fixed;box-sizing:border-box;z-index:2147483647;display:flex}.modal.svelte-1ijkyzl > .button{flex:auto;display:flex}.close.svelte-1ijkyzl{position:absolute;top:0;right:0}.close.svelte-1ijkyzl > .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-1ijkyzl > .button:hover{transform:rotate(90deg)}.modal-content.svelte-1ijkyzl{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-1ijkyzl{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);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-1ijkyzl{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);margin:var(--modal-bp-margin-sp) !important}.background-bp-pc{display:none}.background-bp-sp{display:block}}");
 }
 
@@ -4112,7 +4112,7 @@ function create_if_block_2(ctx) {
 }
 
 // (280:0) {#if visible}
-function create_if_block$9(ctx) {
+function create_if_block$7(ctx) {
 	let div;
 	let button;
 	let div_class_value;
@@ -4398,7 +4398,7 @@ function create_fragment$10(ctx) {
 
 	current_block_type_index = select_block_type(ctx);
 	if_block0 = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
-	let if_block1 = /*visible*/ ctx[16] && create_if_block$9(ctx);
+	let if_block1 = /*visible*/ ctx[16] && create_if_block$7(ctx);
 
 	return {
 		c() {
@@ -4458,7 +4458,7 @@ function create_fragment$10(ctx) {
 						transition_in(if_block1, 1);
 					}
 				} else {
-					if_block1 = create_if_block$9(ctx);
+					if_block1 = create_if_block$7(ctx);
 					if_block1.c();
 					transition_in(if_block1, 1);
 					if_block1.m(if_block1_anchor.parentNode, if_block1_anchor);
@@ -4825,7 +4825,7 @@ class Modal extends SvelteComponent {
 				closeButtonColor: 9,
 				_closeStyle: 10
 			},
-			add_css$t,
+			add_css$z,
 			[-1, -1]
 		);
 	}
@@ -4949,7 +4949,7 @@ class Grid extends SvelteComponent {
 
 /* src/components/GridItem.svelte generated by Svelte v3.53.1 */
 
-function add_css$s(target) {
+function add_css$y(target) {
 	append_styles(target, "svelte-n7kdl3", ".grid-item.svelte-n7kdl3{word-break:break-all;position:relative}.grid-item-inner.svelte-n7kdl3{position:absolute;inset:0}");
 }
 
@@ -5088,7 +5088,7 @@ class GridItem extends SvelteComponent {
 				background: 7,
 				gridItemId: 0
 			},
-			add_css$s
+			add_css$y
 		);
 	}
 }
@@ -5123,7 +5123,7 @@ function create_else_block$2(ctx) {
 }
 
 // (11:2) {#if item.match(regexp)}
-function create_if_block$8(ctx) {
+function create_if_block$6(ctx) {
 	let br;
 
 	return {
@@ -5148,7 +5148,7 @@ function create_each_block$6(ctx) {
 	function select_block_type(ctx, dirty) {
 		if (dirty & /*items*/ 1) show_if = null;
 		if (show_if == null) show_if = !!/*item*/ ctx[2].match(regexp);
-		if (show_if) return create_if_block$8;
+		if (show_if) return create_if_block$6;
 		return create_else_block$2;
 	}
 
@@ -5270,7 +5270,7 @@ class RenderText extends SvelteComponent {
 
 /* src/components/TextElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$r(target) {
+function add_css$x(target) {
 	append_styles(target, "svelte-9ixs0b", ".text-element-wrapper.svelte-9ixs0b.svelte-9ixs0b{position:relative;height:100%}.text-element.svelte-9ixs0b.svelte-9ixs0b{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-9ixs0b.svelte-9ixs0b{text-decoration:none;color:inherit}.text-element-inner.svelte-9ixs0b.svelte-9ixs0b{width:100%;height:auto}.text-direction-vertical.svelte-9ixs0b.svelte-9ixs0b{writing-mode:vertical-rl}.text-direction-vertical.svelte-9ixs0b .text-element-inner.svelte-9ixs0b{width:auto;height:100%}.tooltip.svelte-9ixs0b.svelte-9ixs0b{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-9ixs0b.svelte-9ixs0b:before{content:'';position:absolute;top:-13px;left:50%;margin-left:-7px;border:7px solid transparent;border-bottom:7px solid #3d4948}.tooltip.show.svelte-9ixs0b.svelte-9ixs0b{display:block}.tooltip-error.svelte-9ixs0b.svelte-9ixs0b{background-color:#c00}.tooltip-error.svelte-9ixs0b.svelte-9ixs0b:before{border-bottom:7px solid #c00}");
 }
 
@@ -5328,7 +5328,7 @@ function create_else_block$1(ctx) {
 }
 
 // (80:2) {#if enableCopy}
-function create_if_block$7(ctx) {
+function create_if_block$5(ctx) {
 	let a;
 	let div0;
 	let rendertext;
@@ -5419,7 +5419,7 @@ function create_fragment$Y(ctx) {
 	let current_block_type_index;
 	let if_block;
 	let current;
-	const if_block_creators = [create_if_block$7, create_else_block$1];
+	const if_block_creators = [create_if_block$5, create_else_block$1];
 	const if_blocks = [];
 
 	function select_block_type(ctx, dirty) {
@@ -5592,14 +5592,14 @@ class TextElement extends SvelteComponent {
 				enableCopy: 2,
 				eventName: 10
 			},
-			add_css$r
+			add_css$x
 		);
 	}
 }
 
 /* src/components/TextButtonElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$q(target) {
+function add_css$w(target) {
 	append_styles(target, "svelte-1vg84sc", ".text-button-element.svelte-1vg84sc{width:100%;height:100%}.text-button-element.svelte-1vg84sc > .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-1vg84sc > .button._disabled{cursor:not-allowed !important;opacity:0.2}.text-button-element.svelte-1vg84sc > .button:not(._disabled):active{box-shadow:inset 0 0 100px 100px rgba(0, 0, 0, 0.3)}.text-button-element.svelte-1vg84sc > .button:not(._disabled):hover{box-shadow:inset 0 0 100px 100px rgba(255, 255, 255, 0.3)}");
 }
 
@@ -5740,14 +5740,14 @@ class TextButtonElement extends SvelteComponent {
 				_buttonStyle: 5,
 				_style: 6
 			},
-			add_css$q
+			add_css$w
 		);
 	}
 }
 
 /* src/components/ImageElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$p(target) {
+function add_css$v(target) {
 	append_styles(target, "svelte-t6tu0e", ".image-element.svelte-t6tu0e{width:100%;height:100%;max-width:100%;max-height:100%;box-sizing:border-box}.image-element.svelte-t6tu0e > .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-t6tu0e > .button._disabled{cursor:not-allowed !important;opacity:0.2}.image-element.transport.svelte-t6tu0e > .button:not(._disabled):hover,.image-element.transport.svelte-t6tu0e > .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-t6tu0e{width:100%;height:100%}");
 }
 
@@ -5905,14 +5905,14 @@ class ImageElement extends SvelteComponent {
 				_imageStyle: 6,
 				_style: 7
 			},
-			add_css$p
+			add_css$v
 		);
 	}
 }
 
 /* src/components/List.svelte generated by Svelte v3.53.1 */
 
-function add_css$o(target) {
+function add_css$u(target) {
 	append_styles(target, "svelte-aquv6z", ".list.svelte-aquv6z{display:flex;width:100%;height:100%;overflow:hidden;border-width:0px;border-style:solid;border-color:#000000}");
 }
 
@@ -6052,14 +6052,14 @@ class List extends SvelteComponent {
 				background: 3,
 				_style: 4
 			},
-			add_css$o
+			add_css$u
 		);
 	}
 }
 
 /* src/components/ListItem.svelte generated by Svelte v3.53.1 */
 
-function add_css$n(target) {
+function add_css$t(target) {
 	append_styles(target, "svelte-9n97pe", ".list-item.svelte-9n97pe{flex:auto;box-sizing:border-box;min-width:0;min-height:0;position:relative}.list-item.svelte-9n97pe > .button{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}");
 }
 
@@ -6249,13 +6249,13 @@ function instance$U($$self, $$props, $$invalidate) {
 class ListItem extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$U, create_fragment$U, safe_not_equal, { onClick: 0, clickEventName: 1, _style: 2 }, add_css$n);
+		init(this, options, instance$U, create_fragment$U, safe_not_equal, { onClick: 0, clickEventName: 1, _style: 2 }, add_css$t);
 	}
 }
 
 /* src/components/EmbedElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$m(target) {
+function add_css$s(target) {
 	append_styles(target, "svelte-wocq4p", ".embed.svelte-wocq4p{box-shadow:0 1px rgba(0, 0, 0, 0.06);overflow:hidden;width:100%;height:100%}.embed.svelte-wocq4p iframe{position:absolute;top:0;left:0;width:100%;height:100%;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}");
 }
 
@@ -6301,13 +6301,13 @@ function instance$T($$self, $$props, $$invalidate) {
 class EmbedElement extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$T, create_fragment$T, safe_not_equal, { code: 0, _style: 1 }, add_css$m);
+		init(this, options, instance$T, create_fragment$T, safe_not_equal, { code: 0, _style: 1 }, add_css$s);
 	}
 }
 
 /* src/components/MovieYouTubeElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$l(target) {
+function add_css$r(target) {
 	append_styles(target, "svelte-vikz49", ".embed.svelte-vikz49{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-vikz49 iframe{position:absolute;top:0;left:0;width:100%;height:100%}");
 }
 
@@ -6653,7 +6653,7 @@ class MovieYouTubeElement extends SvelteComponent {
 				mute: 25,
 				_style: 0
 			},
-			add_css$l,
+			add_css$r,
 			[-1, -1]
 		);
 	}
@@ -6661,7 +6661,7 @@ class MovieYouTubeElement extends SvelteComponent {
 
 /* src/components/MovieVimeoElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$k(target) {
+function add_css$q(target) {
 	append_styles(target, "svelte-vikz49", ".embed.svelte-vikz49{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-vikz49 iframe{position:absolute;top:0;left:0;width:100%;height:100%}");
 }
 
@@ -6850,14 +6850,14 @@ class MovieVimeoElement extends SvelteComponent {
 				mute: 6,
 				_style: 0
 			},
-			add_css$k
+			add_css$q
 		);
 	}
 }
 
 /* src/components/FormTextarea.svelte generated by Svelte v3.53.1 */
 
-function add_css$j(target) {
+function add_css$p(target) {
 	append_styles(target, "svelte-zxvkkc", ".textarea-wrapper.svelte-zxvkkc{display:flex;align-items:center;width:100%;height:100%}.textarea.svelte-zxvkkc{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-zxvkkc::placeholder{color:var(--placeholder-color)}.textarea.svelte-zxvkkc:focus{outline:none;border-width:var(--focus-border-width) !important;border-color:var(--focus-border-color) !important;border-style:var(--focus-border-style) !important}");
 }
 
@@ -7020,14 +7020,14 @@ class FormTextarea extends SvelteComponent {
 				_textStyle: 11,
 				_placeholderStyle: 12
 			},
-			add_css$j
+			add_css$p
 		);
 	}
 }
 
 /* src/components/FormRadioButtons.svelte generated by Svelte v3.53.1 */
 
-function add_css$i(target) {
+function add_css$o(target) {
 	append_styles(target, "svelte-17s08g", ".radio-buttons.svelte-17s08g{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%}.radio-button.svelte-17s08g{cursor:pointer;display:flex;align-items:center}.radio-button-input.svelte-17s08g{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-17s08g: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-17s08g{margin-left:0.5em}");
 }
 
@@ -7295,14 +7295,14 @@ class FormRadioButtons extends SvelteComponent {
 				buttonColor: 13,
 				buttonColorActive: 14
 			},
-			add_css$i
+			add_css$o
 		);
 	}
 }
 
 /* src/components/FormSelect.svelte generated by Svelte v3.53.1 */
 
-function add_css$h(target) {
+function add_css$n(target) {
 	append_styles(target, "svelte-t9ynyj", ".select.svelte-t9ynyj{width:100%;height:100%}.select-select.svelte-t9ynyj{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-t9ynyj: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-t9ynyj{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}");
 }
 
@@ -7334,7 +7334,7 @@ function create_else_block(ctx) {
 }
 
 // (105:10) {#if option}
-function create_if_block$6(ctx) {
+function create_if_block$4(ctx) {
 	let t_value = /*option*/ ctx[19] + "";
 	let t;
 
@@ -7362,7 +7362,7 @@ function create_each_block$4(ctx) {
 	let option_selected_value;
 
 	function select_block_type(ctx, dirty) {
-		if (/*option*/ ctx[19]) return create_if_block$6;
+		if (/*option*/ ctx[19]) return create_if_block$4;
 		return create_else_block;
 	}
 
@@ -7634,14 +7634,14 @@ class FormSelect extends SvelteComponent {
 				iconColor: 15,
 				iconSize: 16
 			},
-			add_css$h
+			add_css$n
 		);
 	}
 }
 
 /* src/components/FormCheckBoxes.svelte generated by Svelte v3.53.1 */
 
-function add_css$g(target) {
+function add_css$m(target) {
 	append_styles(target, "svelte-1p65cg8", ".check-boxes.svelte-1p65cg8.svelte-1p65cg8{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%;gap:0px}.check-box.svelte-1p65cg8.svelte-1p65cg8{display:flex;align-items:center;position:relative;cursor:pointer}.check-box-input.svelte-1p65cg8.svelte-1p65cg8{width:var(--size);height:var(--size);margin:0;position:absolute;appearance:none;cursor:pointer}.check-box-check.svelte-1p65cg8.svelte-1p65cg8{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-1p65cg8.svelte-1p65cg8{display:inline-block;--icon-size:calc(var(--size) * 3 / 4);width:var(--icon-size);height:var(--icon-size)}.check-box-icon.svelte-1p65cg8.svelte-1p65cg8: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-1p65cg8.svelte-1p65cg8{background-color:var(--color-main-active)}.check-box-check._checked.svelte-1p65cg8 .check-box-icon.svelte-1p65cg8:after{border-color:var(--color-sub-active)}.check-box-text.svelte-1p65cg8.svelte-1p65cg8{margin-left:0.5em;color:#333;font-size:12px;line-height:1.5}");
 }
 
@@ -7931,14 +7931,14 @@ class FormCheckBoxes extends SvelteComponent {
 				buttonColor: 13,
 				buttonColorActive: 14
 			},
-			add_css$g
+			add_css$m
 		);
 	}
 }
 
 /* src/components/FormRatingButtonsNumber.svelte generated by Svelte v3.53.1 */
 
-function add_css$f(target) {
+function add_css$l(target) {
 	append_styles(target, "svelte-1iqf36p", ".rating-buttons.svelte-1iqf36p{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%}.rating-button.svelte-1iqf36p{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}");
 }
 
@@ -8148,14 +8148,14 @@ class FormRatingButtonsNumber extends SvelteComponent {
 				buttonStyle: 9,
 				buttonActiveStyle: 10
 			},
-			add_css$f
+			add_css$l
 		);
 	}
 }
 
 /* src/components/FormRatingButtonsFace.svelte generated by Svelte v3.53.1 */
 
-function add_css$e(target) {
+function add_css$k(target) {
 	append_styles(target, "svelte-tbunko", ".rating-buttons.svelte-tbunko{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%}.rating-button.svelte-tbunko{appearance:none;background:none;border:none;margin:0;padding:0}.rating-button-image.svelte-tbunko{cursor:pointer;user-select:none;-webkit-user-drag:none;width:100%;height:100%}.rating-button-image.svelte-tbunko:not(._active){filter:grayscale(100%)}");
 }
 
@@ -8333,13 +8333,13 @@ function instance$L($$self, $$props, $$invalidate) {
 class FormRatingButtonsFace extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$L, create_fragment$L, safe_not_equal, { name: 5, required: 6, size: 7 }, add_css$e);
+		init(this, options, instance$L, create_fragment$L, safe_not_equal, { name: 5, required: 6, size: 7 }, add_css$k);
 	}
 }
 
 /* src/components/FormIdentifyInput.svelte generated by Svelte v3.53.1 */
 
-function add_css$d(target) {
+function add_css$j(target) {
 	append_styles(target, "svelte-h8fqwx", ".input-wrapper.svelte-h8fqwx{display:flex;align-items:center;width:100%;height:100%}.input.svelte-h8fqwx{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-h8fqwx::placeholder{color:var(--placeholder-color)}.input.svelte-h8fqwx: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-h8fqwx{outline:none;border-width:var(--error-border-width) !important;border-color:var(--error-border-color) !important;border-style:var(--error-border-style) !important}");
 }
 
@@ -8553,14 +8553,14 @@ class FormIdentifyInput extends SvelteComponent {
 				_textStyle: 15,
 				_placeholderStyle: 16
 			},
-			add_css$d
+			add_css$j
 		);
 	}
 }
 
 /* src/components/FormIdentifyChoices.svelte generated by Svelte v3.53.1 */
 
-function add_css$c(target) {
+function add_css$i(target) {
 	append_styles(target, "svelte-8zbmyo", ".radio-buttons.svelte-8zbmyo{display:flex;justify-content:space-between;flex-direction:column;width:100%;height:100%}.radio-button.svelte-8zbmyo{cursor:pointer;display:flex;align-items:center}.radio-button-input.svelte-8zbmyo{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-8zbmyo: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-8zbmyo{margin-left:0.5em}");
 }
 
@@ -8772,14 +8772,14 @@ class FormIdentifyChoices extends SvelteComponent {
 				buttonColor: 10,
 				buttonColorActive: 11
 			},
-			add_css$c
+			add_css$i
 		);
 	}
 }
 
 /* src/components/Slide.svelte generated by Svelte v3.53.1 */
 
-function add_css$b(target) {
+function add_css$h(target) {
 	append_styles(target, "svelte-ji1fh", ".root.svelte-ji1fh{width:100%;height:100%;position:relative}.container.svelte-ji1fh{width:100%;height:100%;position:relative;overflow:hidden;box-sizing:border-box;border-width:0px;border-style:solid;border-color:#000000}.slide.svelte-ji1fh{height:100%;position:absolute;display:flex}.transition.svelte-ji1fh{transition:left 0.2s cubic-bezier(.04,.67,.53,.96)}.item.svelte-ji1fh{height:100%;flex:none}.prev-button-container.svelte-ji1fh,.next-button-container.svelte-ji1fh{top:50%;height:0;position:absolute;display:flex;overflow:visible;align-items:center}.prev-button-container.svelte-ji1fh{left:0}.next-button-container.svelte-ji1fh{right:0}.move-button.svelte-ji1fh{display:flex;align-items:center;justify-content:center;cursor:pointer;box-sizing:border-box;border:none;background:none;margin:0;padding:0}.navigation.svelte-ji1fh{position:absolute;width:0;left:50%;bottom:0;display:flex;justify-content:center;overflow:visible}.navigation-item.svelte-ji1fh{flex-shrink:0;cursor:pointer;border:none;background:none;margin:0;padding:0;appearance:none}.navigation-item-inner.circle.svelte-ji1fh{border-radius:51%}");
 }
 
@@ -8842,7 +8842,7 @@ function create_if_block_1(ctx) {
 }
 
 // (380:2) {#if isVisibleNextButton}
-function create_if_block$5(ctx) {
+function create_if_block$3(ctx) {
 	let div;
 	let button;
 	let svg;
@@ -8957,7 +8957,7 @@ function create_fragment$I(ctx) {
 	const default_slot_template = /*#slots*/ ctx[32].default;
 	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[31], null);
 	let if_block0 = /*isVisiblePrevButton*/ ctx[12] && create_if_block_1(ctx);
-	let if_block1 = /*isVisibleNextButton*/ ctx[11] && create_if_block$5(ctx);
+	let if_block1 = /*isVisibleNextButton*/ ctx[11] && create_if_block$3(ctx);
 	let each_value = /*items*/ ctx[1];
 	let each_blocks = [];
 
@@ -9067,7 +9067,7 @@ function create_fragment$I(ctx) {
 				if (if_block1) {
 					if_block1.p(ctx, dirty);
 				} else {
-					if_block1 = create_if_block$5(ctx);
+					if_block1 = create_if_block$3(ctx);
 					if_block1.c();
 					if_block1.m(div3, t2);
 				}
@@ -9607,7 +9607,7 @@ class Slide extends SvelteComponent {
 				navigationButton: 25,
 				navigationEdgePosition: 26
 			},
-			add_css$b,
+			add_css$h,
 			[-1, -1, -1]
 		);
 	}
@@ -9615,7 +9615,7 @@ class Slide extends SvelteComponent {
 
 /* src/components/SlideItem.svelte generated by Svelte v3.53.1 */
 
-function add_css$a(target) {
+function add_css$g(target) {
 	append_styles(target, "svelte-9ygf1w", ".item.svelte-9ygf1w{height:100%;flex:none;position:relative}.item.svelte-9ygf1w img{user-select:none;-webkit-user-drag:none}.item-inner.svelte-9ygf1w{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000;cursor:default;overflow:hidden}");
 }
 
@@ -9752,13 +9752,13 @@ function instance$H($$self, $$props, $$invalidate) {
 class SlideItem extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$H, create_fragment$H, safe_not_equal, { _style: 0 }, add_css$a);
+		init(this, options, instance$H, create_fragment$H, safe_not_equal, { _style: 0 }, add_css$g);
 	}
 }
 
 /* src/components/Countdown.svelte generated by Svelte v3.53.1 */
 
-function add_css$9(target) {
+function add_css$f(target) {
 	append_styles(target, "svelte-rroxiz", ".countdown.svelte-rroxiz{position:relative;width:100%;height:100%}.countdown-inner.svelte-rroxiz{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}");
 }
 
@@ -9906,13 +9906,13 @@ function instance$G($$self, $$props, $$invalidate) {
 class Countdown extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$G, create_fragment$G, safe_not_equal, { timeLimit: 2, stateOnEnd: 3, _style: 0 }, add_css$9);
+		init(this, options, instance$G, create_fragment$G, safe_not_equal, { timeLimit: 2, stateOnEnd: 3, _style: 0 }, add_css$f);
 	}
 }
 
 /* src/components/Box.svelte generated by Svelte v3.53.1 */
 
-function add_css$8(target) {
+function add_css$e(target) {
 	append_styles(target, "svelte-1ccydfy", ".box.svelte-1ccydfy{position:relative;width:100%;height:100%}.box.svelte-1ccydfy > .button{position:absolute;inset:0;border-width:0px;border-style:solid;border-color:#000000;overflow:hidden}");
 }
 
@@ -10037,18 +10037,18 @@ function instance$F($$self, $$props, $$invalidate) {
 class Box extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$F, create_fragment$F, safe_not_equal, { onClick: 0, eventName: 1, _style: 2 }, add_css$8);
+		init(this, options, instance$F, create_fragment$F, safe_not_equal, { onClick: 0, eventName: 1, _style: 2 }, add_css$e);
 	}
 }
 
 /* src/components/IconElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$7(target) {
+function add_css$d(target) {
 	append_styles(target, "svelte-1mkvcuo", ".icon.svelte-1mkvcuo{display:flex;justify-content:center;align-items:center;width:100%;height:100%}.icon.svelte-1mkvcuo > .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;overflow:hidden}.icon.svelte-1mkvcuo > .button._disabled{cursor:not-allowed !important;opacity:0.2}.icon.svelte-1mkvcuo svg{width:var(--width);height:var(--height);color:var(--color);stroke:var(--stroke);fill:var(--fill)}");
 }
 
 // (56:4) {#if svg}
-function create_if_block$4(ctx) {
+function create_if_block$2(ctx) {
 	let html_tag;
 	let html_anchor;
 
@@ -10075,7 +10075,7 @@ function create_if_block$4(ctx) {
 // (55:2) <Button {onClick} {style} {eventName}>
 function create_default_slot$1(ctx) {
 	let if_block_anchor;
-	let if_block = /*svg*/ ctx[3] && create_if_block$4(ctx);
+	let if_block = /*svg*/ ctx[3] && create_if_block$2(ctx);
 
 	return {
 		c() {
@@ -10091,7 +10091,7 @@ function create_default_slot$1(ctx) {
 				if (if_block) {
 					if_block.p(ctx, dirty);
 				} else {
-					if_block = create_if_block$4(ctx);
+					if_block = create_if_block$2(ctx);
 					if_block.c();
 					if_block.m(if_block_anchor.parentNode, if_block_anchor);
 				}
@@ -10227,14 +10227,14 @@ class IconElement extends SvelteComponent {
 				color: 6,
 				_style: 7
 			},
-			add_css$7
+			add_css$d
 		);
 	}
 }
 
 /* src/components/CodeElement.svelte generated by Svelte v3.53.1 */
 
-function add_css$6(target) {
+function add_css$c(target) {
 	append_styles(target, "svelte-ymsb9l", ".codeElement.svelte-ymsb9l{box-sizing:border-box;margin:0px;padding:0px;width:100%;height:100%}");
 }
 
@@ -10343,13 +10343,13 @@ function instance$D($$self, $$props, $$invalidate) {
 class CodeElement extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$D, create_fragment$D, safe_not_equal, { name: 0, component: 1, data: 2, style: 3 }, add_css$6);
+		init(this, options, instance$D, create_fragment$D, safe_not_equal, { name: 0, component: 1, data: 2, style: 3 }, add_css$c);
 	}
 }
 
 /* src/components/Flex.svelte generated by Svelte v3.53.1 */
 
-function add_css$5(target) {
+function add_css$b(target) {
 	append_styles(target, "svelte-1e71ejc", ".flex.svelte-1e71ejc{display:flex}");
 }
 
@@ -10453,14 +10453,14 @@ class Flex extends SvelteComponent {
 				height: 2,
 				_style: 3
 			},
-			add_css$5
+			add_css$b
 		);
 	}
 }
 
 /* src/components/FlexItem.svelte generated by Svelte v3.53.1 */
 
-function add_css$4(target) {
+function add_css$a(target) {
 	append_styles(target, "svelte-1p0bk1x", ".flex-item.svelte-1p0bk1x{max-width:100%;max-height:100%;position:relative;isolation:isolate}");
 }
 
@@ -10565,7 +10565,7 @@ function instance$B($$self, $$props, $$invalidate) {
 class FlexItem extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$B, create_fragment$B, safe_not_equal, { length: 1, _style: 2 }, add_css$4);
+		init(this, options, instance$B, create_fragment$B, safe_not_equal, { length: 1, _style: 2 }, add_css$a);
 	}
 }
 
@@ -10881,7 +10881,7 @@ class GridModalState extends SvelteComponent {
 
 /* src/components/TextBlock.svelte generated by Svelte v3.53.1 */
 
-function add_css$3(target) {
+function add_css$9(target) {
 	append_styles(target, "svelte-15pej1m", ".text-block.svelte-15pej1m.svelte-15pej1m{display:flex;position:relative;width:100%;height:100%;box-sizing:border-box;white-space:pre-wrap;overflow:hidden}.text-block-inner.svelte-15pej1m.svelte-15pej1m{width:100%;height:auto}.text-direction-vertical.svelte-15pej1m.svelte-15pej1m{writing-mode:vertical-rl}.text-direction-vertical.svelte-15pej1m .text-block-inner.svelte-15pej1m{width:auto;height:100%}");
 }
 
@@ -10983,14 +10983,14 @@ class TextBlock extends SvelteComponent {
 				textDirection: 1,
 				_style: 5
 			},
-			add_css$3
+			add_css$9
 		);
 	}
 }
 
 /* src/components/TextButtonBlock.svelte generated by Svelte v3.53.1 */
 
-function add_css$2(target) {
+function add_css$8(target) {
 	append_styles(target, "svelte-ff0k6r", ".text-button-block.svelte-ff0k6r{width:100%;height:100%;background-color:#000000;border-radius:4px}.text-button.svelte-ff0k6r{display:flex;width:100%;height:100%;background-color:transparent;border:none;box-shadow:transparent;box-sizing:border-box;cursor:pointer;transition:box-shadow 0.2s;color:#ffffff;font-size:14px;font-weight:bold;justify-content:center;align-items:center;padding:1px 6px 1px 6px;line-height:1.5}.text-button.svelte-ff0k6r:active{box-shadow:inset 0 0 100px 100px rgba(0, 0, 0, 0.3)}.text-button.svelte-ff0k6r:hover{box-shadow:inset 0 0 100px 100px rgba(255, 255, 255, 0.3)}");
 }
 
@@ -11108,14 +11108,14 @@ class TextButtonBlock extends SvelteComponent {
 				_buttonStyle: 1,
 				_style: 2
 			},
-			add_css$2
+			add_css$8
 		);
 	}
 }
 
 /* src/components/ImageBlock.svelte generated by Svelte v3.53.1 */
 
-function add_css$1(target) {
+function add_css$7(target) {
 	append_styles(target, "svelte-1pdw891", ".image-block.svelte-1pdw891{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.svelte-1pdw891{width:100%;height:100%}.transport.svelte-1pdw891:hover,.transport.svelte-1pdw891:focus{opacity:0.75;box-shadow:0 5px 16px rgba(0, 0, 0, 0.1), 0 8px 28px rgba(0, 0, 0, 0.16)}");
 }
 
@@ -11235,63 +11235,213 @@ class ImageBlock extends SvelteComponent {
 				_imageStyle: 4,
 				_style: 5
 			},
-			add_css$1
+			add_css$7
 		);
 	}
 }
 
-/* src/components-v2/icon/variants/IconArrowDown.svelte generated by Svelte v3.53.1 */
+const COMPONENT_PARAMETER_TYPES = {
+    TEXT: 'text',
+    MULTILINE_TEXT: 'multiline_text',
+    SELECT: 'select',
+    RADIO: 'radio',
+    CHECKBOX: 'checkbox',
+    BOOLEAN: 'boolean',
+    IMAGE: 'image',
+    NUMBER: 'number',
+    WIDTH: 'width',
+    ASPECT: 'aspect',
+    COLOR: 'color',
+    ICON: 'icon',
+};
+
+const toHyphenCase = (str) => {
+    let result = str.replace(/_/g, '-');
+    result = result.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+    return result;
+};
+const objToStyle = (obj) => {
+    const styles = Object.entries(obj)
+        .map(([key, value]) => {
+        if (value === undefined)
+            return '';
+        return `${toHyphenCase(key)}: ${value};`;
+    })
+        .filter(v => v !== '');
+    return styles.join(' ');
+};
+
+const toCssPosition = (p) => {
+    return {
+        position: p?.position ?? 'static',
+        top: p?.top,
+        left: p?.left,
+        bottom: p?.bottom,
+        right: p?.right,
+    };
+};
+const toCssCommon = (p) => {
+    return {
+        ...toCssPosition(p),
+    };
+};
+const toCssBorder = (p) => {
+    const borderWidth = p?.borderTopWidth ?? p?.borderRightWidth ?? p?.borderLeftWidth ?? p?.borderBottomWidth ?? null;
+    if (borderWidth === null)
+        return {};
+    return {
+        borderColor: p?.borderColor,
+        borderStyle: 'solid',
+        borderTopWidth: p?.borderTopWidth,
+        borderLeftWidth: p?.borderLeftWidth,
+        borderRightWidth: p?.borderRightWidth,
+        borderBottomWidth: p?.borderBottomWidth,
+    };
+};
+const toCssPadding = (p) => {
+    return {
+        paddingTop: p?.paddingTop,
+        paddingLeft: p?.paddingLeft,
+        paddingRight: p?.paddingRight,
+        paddingBottom: p?.paddingBottom,
+    };
+};
+const toCssBackgroundImage = (p) => {
+    const url = p?.backgroundImageUrl;
+    return {
+        backgroundImage: url ? `url(${url})` : undefined,
+        backgroundSize: url ? 'cover' : undefined,
+    };
+};
+const toCssBackgroundColor = (p) => {
+    return {
+        backgroundColor: p?.backgroundColor,
+    };
+};
+const toCssRadius = (p) => {
+    return {
+        borderTopLeftRadius: p?.borderTopLeftRadius,
+        borderTopRightRadius: p?.borderTopRightRadius,
+        borderBottomLeftRadius: p?.borderBottomLeftRadius,
+        borderBottomRightRadius: p?.borderBottomRightRadius,
+    };
+};
+const toCssShadow = (p) => {
+    return {
+        boxShadow: p?.shadow,
+    };
+};
+
+/* src/components-v2/avatar/Avatar.svelte generated by Svelte v3.53.1 */
+
+function add_css$6(target) {
+	append_styles(target, "svelte-17xar9h", ".avatar.svelte-17xar9h{display:flex;align-items:center;overflow:hidden;flex-shrink:0}");
+}
 
 function create_fragment$w(ctx) {
-	let svg;
-	let path;
+	let div;
+	let img;
+	let img_src_value;
+	let img_alt_value;
 
 	return {
 		c() {
-			svg = svg_element("svg");
-			path = svg_element("path");
-			attr(path, "fill", /*color*/ ctx[0]);
-			attr(path, "d", "M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z");
-			attr(svg, "xmlns", "http://www.w3.org/2000/svg");
-			set_style(svg, "width", "100%");
-			set_style(svg, "height", "100%");
-			attr(svg, "viewBox", "0 0 384 512");
+			div = element("div");
+			img = element("img");
+			if (!src_url_equal(img.src, img_src_value = /*props*/ ctx[0].image)) attr(img, "src", img_src_value);
+			attr(img, "alt", img_alt_value = /*props*/ ctx[0].alt);
+			attr(img, "style", /*imgStyle*/ ctx[1]);
+			attr(div, "class", "avatar svelte-17xar9h");
+			attr(div, "style", /*style*/ ctx[2]);
 		},
 		m(target, anchor) {
-			insert(target, svg, anchor);
-			append(svg, path);
+			insert(target, div, anchor);
+			append(div, img);
 		},
 		p(ctx, [dirty]) {
-			if (dirty & /*color*/ 1) {
-				attr(path, "fill", /*color*/ ctx[0]);
+			if (dirty & /*props*/ 1 && !src_url_equal(img.src, img_src_value = /*props*/ ctx[0].image)) {
+				attr(img, "src", img_src_value);
+			}
+
+			if (dirty & /*props*/ 1 && img_alt_value !== (img_alt_value = /*props*/ ctx[0].alt)) {
+				attr(img, "alt", img_alt_value);
+			}
+
+			if (dirty & /*imgStyle*/ 2) {
+				attr(img, "style", /*imgStyle*/ ctx[1]);
+			}
+
+			if (dirty & /*style*/ 4) {
+				attr(div, "style", /*style*/ ctx[2]);
 			}
 		},
 		i: noop,
 		o: noop,
 		d(detaching) {
-			if (detaching) detach(svg);
+			if (detaching) detach(div);
 		}
 	};
 }
 
 function instance$w($$self, $$props, $$invalidate) {
-	let { color } = $$props;
+	let style;
+	let imgStyle;
+	let { props = {} } = $$props;
+
+	const VARIANTS = {
+		shape: {
+			circle: { borderRadius: '100%' },
+			square: { borderRadius: '4px' }
+		}
+	};
+
+	const size = props.size ?? 64;
 
 	$$self.$$set = $$props => {
-		if ('color' in $$props) $$invalidate(0, color = $$props.color);
+		if ('props' in $$props) $$invalidate(0, props = $$props.props);
 	};
 
-	return [color];
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*props*/ 1) {
+			$$invalidate(2, style = objToStyle({
+				width: `${size}px`,
+				height: `${size}px`,
+				...VARIANTS.shape[props.shape ?? 'square'],
+				...props.bordered && { border: `1px solid #dbdbdb` },
+				...toCssCommon(props)
+			}));
+		}
+	};
+
+	$$invalidate(1, imgStyle = objToStyle({
+		width: '100%',
+		height: '100%',
+		objectFit: 'cover'
+	}));
+
+	return [props, imgStyle, style];
 }
 
-class IconArrowDown extends SvelteComponent {
+class Avatar extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$w, create_fragment$w, safe_not_equal, { color: 0 });
+		init(this, options, instance$w, create_fragment$w, safe_not_equal, { props: 0 }, add_css$6);
 	}
 }
 
-/* src/components-v2/icon/variants/IconArrowUp.svelte generated by Svelte v3.53.1 */
+const AVATAR_SIZE = {
+    extra_small: 'XS（48 x 48）',
+    small: 'S（64 x 64）',
+    medium: 'M（88 x 88）',
+    large: 'L（108 x 108）',
+    extra_large: 'XL（128 x 128）',
+};
+const AVATAR_SHAPE = {
+    circle: 'サークル',
+    square: 'スクエア',
+};
+
+/* src/components-v2/icon/variants/IconArrowDown.svelte generated by Svelte v3.53.1 */
 
 function create_fragment$v(ctx) {
 	let svg;
@@ -11302,7 +11452,7 @@ function create_fragment$v(ctx) {
 			svg = svg_element("svg");
 			path = svg_element("path");
 			attr(path, "fill", /*color*/ ctx[0]);
-			attr(path, "d", "M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 141.2V448c0 17.7 14.3 32 32 32s32-14.3 32-32V141.2L329.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z");
+			attr(path, "d", "M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z");
 			attr(svg, "xmlns", "http://www.w3.org/2000/svg");
 			set_style(svg, "width", "100%");
 			set_style(svg, "height", "100%");
@@ -11335,14 +11485,14 @@ function instance$v($$self, $$props, $$invalidate) {
 	return [color];
 }
 
-class IconArrowUp extends SvelteComponent {
+class IconArrowDown extends SvelteComponent {
 	constructor(options) {
 		super();
 		init(this, options, instance$v, create_fragment$v, safe_not_equal, { color: 0 });
 	}
 }
 
-/* src/components-v2/icon/variants/IconUsers.svelte generated by Svelte v3.53.1 */
+/* src/components-v2/icon/variants/IconArrowUp.svelte generated by Svelte v3.53.1 */
 
 function create_fragment$u(ctx) {
 	let svg;
@@ -11353,11 +11503,11 @@ function create_fragment$u(ctx) {
 			svg = svg_element("svg");
 			path = svg_element("path");
 			attr(path, "fill", /*color*/ ctx[0]);
-			attr(path, "d", "M144 0a80 80 0 1 1 0 160A80 80 0 1 1 144 0zM512 0a80 80 0 1 1 0 160A80 80 0 1 1 512 0zM0 298.7C0 239.8 47.8 192 106.7 192h42.7c15.9 0 31 3.5 44.6 9.7c-1.3 7.2-1.9 14.7-1.9 22.3c0 38.2 16.8 72.5 43.3 96c-.2 0-.4 0-.7 0H21.3C9.6 320 0 310.4 0 298.7zM405.3 320c-.2 0-.4 0-.7 0c26.6-23.5 43.3-57.8 43.3-96c0-7.6-.7-15-1.9-22.3c13.6-6.3 28.7-9.7 44.6-9.7h42.7C592.2 192 640 239.8 640 298.7c0 11.8-9.6 21.3-21.3 21.3H405.3zM224 224a96 96 0 1 1 192 0 96 96 0 1 1 -192 0zM128 485.3C128 411.7 187.7 352 261.3 352H378.7C452.3 352 512 411.7 512 485.3c0 14.7-11.9 26.7-26.7 26.7H154.7c-14.7 0-26.7-11.9-26.7-26.7z");
+			attr(path, "d", "M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 141.2V448c0 17.7 14.3 32 32 32s32-14.3 32-32V141.2L329.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z");
 			attr(svg, "xmlns", "http://www.w3.org/2000/svg");
 			set_style(svg, "width", "100%");
 			set_style(svg, "height", "100%");
-			attr(svg, "viewBox", "0 0 640 512");
+			attr(svg, "viewBox", "0 0 384 512");
 		},
 		m(target, anchor) {
 			insert(target, svg, anchor);
@@ -11386,19 +11536,70 @@ function instance$u($$self, $$props, $$invalidate) {
 	return [color];
 }
 
-class IconUsers extends SvelteComponent {
+class IconArrowUp extends SvelteComponent {
 	constructor(options) {
 		super();
 		init(this, options, instance$u, create_fragment$u, safe_not_equal, { color: 0 });
 	}
 }
 
-/* src/components-v2/icon/variants/IconArrowLeft.svelte generated by Svelte v3.53.1 */
+/* src/components-v2/icon/variants/IconUsers.svelte generated by Svelte v3.53.1 */
 
 function create_fragment$t(ctx) {
 	let svg;
 	let path;
 
+	return {
+		c() {
+			svg = svg_element("svg");
+			path = svg_element("path");
+			attr(path, "fill", /*color*/ ctx[0]);
+			attr(path, "d", "M144 0a80 80 0 1 1 0 160A80 80 0 1 1 144 0zM512 0a80 80 0 1 1 0 160A80 80 0 1 1 512 0zM0 298.7C0 239.8 47.8 192 106.7 192h42.7c15.9 0 31 3.5 44.6 9.7c-1.3 7.2-1.9 14.7-1.9 22.3c0 38.2 16.8 72.5 43.3 96c-.2 0-.4 0-.7 0H21.3C9.6 320 0 310.4 0 298.7zM405.3 320c-.2 0-.4 0-.7 0c26.6-23.5 43.3-57.8 43.3-96c0-7.6-.7-15-1.9-22.3c13.6-6.3 28.7-9.7 44.6-9.7h42.7C592.2 192 640 239.8 640 298.7c0 11.8-9.6 21.3-21.3 21.3H405.3zM224 224a96 96 0 1 1 192 0 96 96 0 1 1 -192 0zM128 485.3C128 411.7 187.7 352 261.3 352H378.7C452.3 352 512 411.7 512 485.3c0 14.7-11.9 26.7-26.7 26.7H154.7c-14.7 0-26.7-11.9-26.7-26.7z");
+			attr(svg, "xmlns", "http://www.w3.org/2000/svg");
+			set_style(svg, "width", "100%");
+			set_style(svg, "height", "100%");
+			attr(svg, "viewBox", "0 0 640 512");
+		},
+		m(target, anchor) {
+			insert(target, svg, anchor);
+			append(svg, path);
+		},
+		p(ctx, [dirty]) {
+			if (dirty & /*color*/ 1) {
+				attr(path, "fill", /*color*/ ctx[0]);
+			}
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (detaching) detach(svg);
+		}
+	};
+}
+
+function instance$t($$self, $$props, $$invalidate) {
+	let { color } = $$props;
+
+	$$self.$$set = $$props => {
+		if ('color' in $$props) $$invalidate(0, color = $$props.color);
+	};
+
+	return [color];
+}
+
+class IconUsers extends SvelteComponent {
+	constructor(options) {
+		super();
+		init(this, options, instance$t, create_fragment$t, safe_not_equal, { color: 0 });
+	}
+}
+
+/* src/components-v2/icon/variants/IconArrowLeft.svelte generated by Svelte v3.53.1 */
+
+function create_fragment$s(ctx) {
+	let svg;
+	let path;
+
 	return {
 		c() {
 			svg = svg_element("svg");
@@ -11427,7 +11628,7 @@ function create_fragment$t(ctx) {
 	};
 }
 
-function instance$t($$self, $$props, $$invalidate) {
+function instance$s($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11440,13 +11641,13 @@ function instance$t($$self, $$props, $$invalidate) {
 class IconArrowLeft extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$t, create_fragment$t, safe_not_equal, { color: 0 });
+		init(this, options, instance$s, create_fragment$s, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconArrowRight.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$s(ctx) {
+function create_fragment$r(ctx) {
 	let svg;
 	let path;
 
@@ -11478,7 +11679,7 @@ function create_fragment$s(ctx) {
 	};
 }
 
-function instance$s($$self, $$props, $$invalidate) {
+function instance$r($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11491,13 +11692,13 @@ function instance$s($$self, $$props, $$invalidate) {
 class IconArrowRight extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$s, create_fragment$s, safe_not_equal, { color: 0 });
+		init(this, options, instance$r, create_fragment$r, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconBell.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$r(ctx) {
+function create_fragment$q(ctx) {
 	let svg;
 	let path;
 
@@ -11529,7 +11730,7 @@ function create_fragment$r(ctx) {
 	};
 }
 
-function instance$r($$self, $$props, $$invalidate) {
+function instance$q($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11542,13 +11743,13 @@ function instance$r($$self, $$props, $$invalidate) {
 class IconBell extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$r, create_fragment$r, safe_not_equal, { color: 0 });
+		init(this, options, instance$q, create_fragment$q, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconArrowUpFromSquare.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$q(ctx) {
+function create_fragment$p(ctx) {
 	let svg;
 	let path;
 
@@ -11580,7 +11781,7 @@ function create_fragment$q(ctx) {
 	};
 }
 
-function instance$q($$self, $$props, $$invalidate) {
+function instance$p($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11593,13 +11794,13 @@ function instance$q($$self, $$props, $$invalidate) {
 class IconArrowUpFromSquare extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$q, create_fragment$q, safe_not_equal, { color: 0 });
+		init(this, options, instance$p, create_fragment$p, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconTicket.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$p(ctx) {
+function create_fragment$o(ctx) {
 	let svg;
 	let path;
 
@@ -11631,7 +11832,7 @@ function create_fragment$p(ctx) {
 	};
 }
 
-function instance$p($$self, $$props, $$invalidate) {
+function instance$o($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11644,13 +11845,13 @@ function instance$p($$self, $$props, $$invalidate) {
 class IconTicket extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$p, create_fragment$p, safe_not_equal, { color: 0 });
+		init(this, options, instance$o, create_fragment$o, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconTrack.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$o(ctx) {
+function create_fragment$n(ctx) {
 	let svg;
 	let path;
 
@@ -11682,7 +11883,7 @@ function create_fragment$o(ctx) {
 	};
 }
 
-function instance$o($$self, $$props, $$invalidate) {
+function instance$n($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11695,13 +11896,13 @@ function instance$o($$self, $$props, $$invalidate) {
 class IconTrack extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$o, create_fragment$o, safe_not_equal, { color: 0 });
+		init(this, options, instance$n, create_fragment$n, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconCartShopping.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$n(ctx) {
+function create_fragment$m(ctx) {
 	let svg;
 	let path;
 
@@ -11733,7 +11934,7 @@ function create_fragment$n(ctx) {
 	};
 }
 
-function instance$n($$self, $$props, $$invalidate) {
+function instance$m($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11746,13 +11947,13 @@ function instance$n($$self, $$props, $$invalidate) {
 class IconCartShopping extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$n, create_fragment$n, safe_not_equal, { color: 0 });
+		init(this, options, instance$m, create_fragment$m, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconCircle.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$m(ctx) {
+function create_fragment$l(ctx) {
 	let svg;
 	let path;
 
@@ -11784,7 +11985,7 @@ function create_fragment$m(ctx) {
 	};
 }
 
-function instance$m($$self, $$props, $$invalidate) {
+function instance$l($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11797,13 +11998,13 @@ function instance$m($$self, $$props, $$invalidate) {
 class IconCircle extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$m, create_fragment$m, safe_not_equal, { color: 0 });
+		init(this, options, instance$l, create_fragment$l, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconCircleQuestion.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$l(ctx) {
+function create_fragment$k(ctx) {
 	let svg;
 	let path;
 
@@ -11835,7 +12036,7 @@ function create_fragment$l(ctx) {
 	};
 }
 
-function instance$l($$self, $$props, $$invalidate) {
+function instance$k($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11848,13 +12049,13 @@ function instance$l($$self, $$props, $$invalidate) {
 class IconCircleQuestion extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$l, create_fragment$l, safe_not_equal, { color: 0 });
+		init(this, options, instance$k, create_fragment$k, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconCheck.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$k(ctx) {
+function create_fragment$j(ctx) {
 	let svg;
 	let path;
 
@@ -11886,7 +12087,7 @@ function create_fragment$k(ctx) {
 	};
 }
 
-function instance$k($$self, $$props, $$invalidate) {
+function instance$j($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11899,13 +12100,13 @@ function instance$k($$self, $$props, $$invalidate) {
 class IconCheck extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$k, create_fragment$k, safe_not_equal, { color: 0 });
+		init(this, options, instance$j, create_fragment$j, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconXMark.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$j(ctx) {
+function create_fragment$i(ctx) {
 	let svg;
 	let path;
 
@@ -11937,7 +12138,7 @@ function create_fragment$j(ctx) {
 	};
 }
 
-function instance$j($$self, $$props, $$invalidate) {
+function instance$i($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -11950,13 +12151,13 @@ function instance$j($$self, $$props, $$invalidate) {
 class IconXMark extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$j, create_fragment$j, safe_not_equal, { color: 0 });
+		init(this, options, instance$i, create_fragment$i, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconPaperPlane.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$i(ctx) {
+function create_fragment$h(ctx) {
 	let svg;
 	let path;
 
@@ -11988,7 +12189,7 @@ function create_fragment$i(ctx) {
 	};
 }
 
-function instance$i($$self, $$props, $$invalidate) {
+function instance$h($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12001,13 +12202,13 @@ function instance$i($$self, $$props, $$invalidate) {
 class IconPaperPlane extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$i, create_fragment$i, safe_not_equal, { color: 0 });
+		init(this, options, instance$h, create_fragment$h, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconCopy.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$h(ctx) {
+function create_fragment$g(ctx) {
 	let svg;
 	let path;
 
@@ -12039,7 +12240,7 @@ function create_fragment$h(ctx) {
 	};
 }
 
-function instance$h($$self, $$props, $$invalidate) {
+function instance$g($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12052,13 +12253,13 @@ function instance$h($$self, $$props, $$invalidate) {
 class IconCopy extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$h, create_fragment$h, safe_not_equal, { color: 0 });
+		init(this, options, instance$g, create_fragment$g, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconCircleXMark.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$g(ctx) {
+function create_fragment$f(ctx) {
 	let svg;
 	let path;
 
@@ -12090,7 +12291,7 @@ function create_fragment$g(ctx) {
 	};
 }
 
-function instance$g($$self, $$props, $$invalidate) {
+function instance$f($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12103,13 +12304,13 @@ function instance$g($$self, $$props, $$invalidate) {
 class IconCircleXMark extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$g, create_fragment$g, safe_not_equal, { color: 0 });
+		init(this, options, instance$f, create_fragment$f, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconHeart.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$f(ctx) {
+function create_fragment$e(ctx) {
 	let svg;
 	let path;
 
@@ -12141,7 +12342,7 @@ function create_fragment$f(ctx) {
 	};
 }
 
-function instance$f($$self, $$props, $$invalidate) {
+function instance$e($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12154,13 +12355,13 @@ function instance$f($$self, $$props, $$invalidate) {
 class IconHeart extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$f, create_fragment$f, safe_not_equal, { color: 0 });
+		init(this, options, instance$e, create_fragment$e, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconMagnifyingGrass.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$e(ctx) {
+function create_fragment$d(ctx) {
 	let svg;
 	let path;
 
@@ -12192,7 +12393,7 @@ function create_fragment$e(ctx) {
 	};
 }
 
-function instance$e($$self, $$props, $$invalidate) {
+function instance$d($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12205,13 +12406,13 @@ function instance$e($$self, $$props, $$invalidate) {
 class IconMagnifyingGrass extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$e, create_fragment$e, safe_not_equal, { color: 0 });
+		init(this, options, instance$d, create_fragment$d, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconStar.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$d(ctx) {
+function create_fragment$c(ctx) {
 	let svg;
 	let path;
 
@@ -12243,7 +12444,7 @@ function create_fragment$d(ctx) {
 	};
 }
 
-function instance$d($$self, $$props, $$invalidate) {
+function instance$c($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12256,13 +12457,13 @@ function instance$d($$self, $$props, $$invalidate) {
 class IconStar extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$d, create_fragment$d, safe_not_equal, { color: 0 });
+		init(this, options, instance$c, create_fragment$c, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconCircleInfo.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$c(ctx) {
+function create_fragment$b(ctx) {
 	let svg;
 	let path;
 
@@ -12294,7 +12495,7 @@ function create_fragment$c(ctx) {
 	};
 }
 
-function instance$c($$self, $$props, $$invalidate) {
+function instance$b($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12307,13 +12508,13 @@ function instance$c($$self, $$props, $$invalidate) {
 class IconCircleInfo extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$c, create_fragment$c, safe_not_equal, { color: 0 });
+		init(this, options, instance$b, create_fragment$b, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconEnvelope.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$b(ctx) {
+function create_fragment$a(ctx) {
 	let svg;
 	let path;
 
@@ -12345,7 +12546,7 @@ function create_fragment$b(ctx) {
 	};
 }
 
-function instance$b($$self, $$props, $$invalidate) {
+function instance$a($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12358,13 +12559,13 @@ function instance$b($$self, $$props, $$invalidate) {
 class IconEnvelope extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$b, create_fragment$b, safe_not_equal, { color: 0 });
+		init(this, options, instance$a, create_fragment$a, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconGift.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$a(ctx) {
+function create_fragment$9(ctx) {
 	let svg;
 	let path;
 
@@ -12396,7 +12597,7 @@ function create_fragment$a(ctx) {
 	};
 }
 
-function instance$a($$self, $$props, $$invalidate) {
+function instance$9($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12409,13 +12610,13 @@ function instance$a($$self, $$props, $$invalidate) {
 class IconGift extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$a, create_fragment$a, safe_not_equal, { color: 0 });
+		init(this, options, instance$9, create_fragment$9, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconPaperclip.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$9(ctx) {
+function create_fragment$8(ctx) {
 	let svg;
 	let path;
 
@@ -12447,7 +12648,7 @@ function create_fragment$9(ctx) {
 	};
 }
 
-function instance$9($$self, $$props, $$invalidate) {
+function instance$8($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12460,13 +12661,13 @@ function instance$9($$self, $$props, $$invalidate) {
 class IconPaperclip extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$9, create_fragment$9, safe_not_equal, { color: 0 });
+		init(this, options, instance$8, create_fragment$8, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconFire.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$8(ctx) {
+function create_fragment$7(ctx) {
 	let svg;
 	let path;
 
@@ -12498,7 +12699,7 @@ function create_fragment$8(ctx) {
 	};
 }
 
-function instance$8($$self, $$props, $$invalidate) {
+function instance$7($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12511,13 +12712,13 @@ function instance$8($$self, $$props, $$invalidate) {
 class IconFire extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$8, create_fragment$8, safe_not_equal, { color: 0 });
+		init(this, options, instance$7, create_fragment$7, safe_not_equal, { color: 0 });
 	}
 }
 
 /* src/components-v2/icon/variants/IconLink.svelte generated by Svelte v3.53.1 */
 
-function create_fragment$7(ctx) {
+function create_fragment$6(ctx) {
 	let svg;
 	let path;
 
@@ -12549,7 +12750,7 @@ function create_fragment$7(ctx) {
 	};
 }
 
-function instance$7($$self, $$props, $$invalidate) {
+function instance$6($$self, $$props, $$invalidate) {
 	let { color } = $$props;
 
 	$$self.$$set = $$props => {
@@ -12562,7 +12763,7 @@ function instance$7($$self, $$props, $$invalidate) {
 class IconLink extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$7, create_fragment$7, safe_not_equal, { color: 0 });
+		init(this, options, instance$6, create_fragment$6, safe_not_equal, { color: 0 });
 	}
 }
 
@@ -12626,7 +12827,7 @@ const ICON_VARIANTS = {
     x_mark: IconXMark,
 };
 // @ts-ignore
-[
+const ICON_PARAMS = [
     {
         id: 'variant',
         name: 'アイコン',
@@ -12648,95 +12849,22 @@ const ICON_VARIANTS = {
     },
 ];
 
-const toHyphenCase = (str) => {
-    let result = str.replace(/_/g, '-');
-    result = result.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
-    return result;
-};
-const objToStyle = (obj) => {
-    const styles = Object.entries(obj)
-        .map(([key, value]) => {
-        if (value === undefined)
-            return '';
-        return `${toHyphenCase(key)}: ${value};`;
-    })
-        .filter(v => v !== '');
-    return styles.join(' ');
-};
+/* src/components-v2/icon/Icon.svelte generated by Svelte v3.53.1 */
 
-const toCssPosition = (p) => {
-    return {
-        position: p?.position ?? 'static',
-        top: p?.top,
-        left: p?.left,
-        bottom: p?.bottom,
-        right: p?.right,
-    };
-};
-const toCssCommon = (p) => {
-    return {
-        ...toCssPosition(p),
-    };
-};
-const toCssBorder = (p) => {
-    const borderWidth = p?.borderTopWidth ?? p?.borderRightWidth ?? p?.borderLeftWidth ?? p?.borderBottomWidth ?? null;
-    if (borderWidth === null)
-        return {};
-    return {
-        borderColor: p?.borderColor,
-        borderStyle: 'solid',
-        borderTopWidth: p?.borderTopWidth,
-        borderLeftWidth: p?.borderLeftWidth,
-        borderRightWidth: p?.borderRightWidth,
-        borderBottomWidth: p?.borderBottomWidth,
-    };
-};
-const toCssPadding = (p) => {
-    return {
-        paddingTop: p?.paddingTop,
-        paddingLeft: p?.paddingLeft,
-        paddingRight: p?.paddingRight,
-        paddingBottom: p?.paddingBottom,
-    };
-};
-const toCssBackgroundImage = (p) => {
-    const url = p?.backgroundImageUrl;
-    return {
-        backgroundImage: url ? `url(${url})` : undefined,
-        backgroundSize: url ? 'cover' : undefined,
-    };
-};
-const toCssBackgroundColor = (p) => {
-    return {
-        backgroundColor: p?.backgroundColor,
-    };
-};
-const toCssRadius = (p) => {
-    return {
-        borderTopLeftRadius: p?.borderTopLeftRadius,
-        borderTopRightRadius: p?.borderTopRightRadius,
-        borderBottomLeftRadius: p?.borderBottomLeftRadius,
-        borderBottomRightRadius: p?.borderBottomRightRadius,
-    };
-};
-const toCssShadow = (p) => {
-    return {
-        boxShadow: p?.shadow,
-    };
-};
-
-/* src/components-v2/icon/Icon.svelte generated by Svelte v3.53.1 */
+function add_css$5(target) {
+	append_styles(target, "svelte-1mx2edd", ".icon.svelte-1mx2edd{display:inline-flex;align-items:center;overflow:hidden;width:auto}");
+}
 
-function create_if_block$3(ctx) {
+// (14:0) {#if (IconComponent)}
+function create_if_block$1(ctx) {
 	let div;
 	let switch_instance;
-	let div_style_value;
 	let current;
-	var switch_value = /*IconComponent*/ ctx[3];
+	var switch_value = /*IconComponent*/ ctx[1];
 
 	function switch_props(ctx) {
 		return {
-			props: { color: /*props*/ ctx[1].color ?? '#333' }
+			props: { color: /*props*/ ctx[0].color ?? '#333' }
 		};
 	}
 
@@ -12748,9 +12876,8 @@ function create_if_block$3(ctx) {
 		c() {
 			div = element("div");
 			if (switch_instance) create_component(switch_instance.$$.fragment);
-			attr(div, "data-layer-id", /*layerId*/ ctx[0]);
-			attr(div, "data-component-id", "icon");
-			attr(div, "style", div_style_value = [/*style*/ ctx[4], /*overrideStyle*/ ctx[2]].join(' '));
+			attr(div, "class", "icon svelte-1mx2edd");
+			attr(div, "style", /*style*/ ctx[2]);
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -12759,9 +12886,9 @@ function create_if_block$3(ctx) {
 		},
 		p(ctx, dirty) {
 			const switch_instance_changes = {};
-			if (dirty & /*props*/ 2) switch_instance_changes.color = /*props*/ ctx[1].color ?? '#333';
+			if (dirty & /*props*/ 1) switch_instance_changes.color = /*props*/ ctx[0].color ?? '#333';
 
-			if (switch_value !== (switch_value = /*IconComponent*/ ctx[3])) {
+			if (switch_value !== (switch_value = /*IconComponent*/ ctx[1])) {
 				if (switch_instance) {
 					group_outros();
 					const old_component = switch_instance;
@@ -12785,12 +12912,8 @@ function create_if_block$3(ctx) {
 				switch_instance.$set(switch_instance_changes);
 			}
 
-			if (!current || dirty & /*layerId*/ 1) {
-				attr(div, "data-layer-id", /*layerId*/ ctx[0]);
-			}
-
-			if (!current || dirty & /*style, overrideStyle*/ 20 && div_style_value !== (div_style_value = [/*style*/ ctx[4], /*overrideStyle*/ ctx[2]].join(' '))) {
-				attr(div, "style", div_style_value);
+			if (!current || dirty & /*style*/ 4) {
+				attr(div, "style", /*style*/ ctx[2]);
 			}
 		},
 		i(local) {
@@ -12809,10 +12932,10 @@ function create_if_block$3(ctx) {
 	};
 }
 
-function create_fragment$6(ctx) {
+function create_fragment$5(ctx) {
 	let if_block_anchor;
 	let current;
-	let if_block = /*IconComponent*/ ctx[3] && create_if_block$3(ctx);
+	let if_block = /*IconComponent*/ ctx[1] && create_if_block$1(ctx);
 
 	return {
 		c() {
@@ -12825,15 +12948,15 @@ function create_fragment$6(ctx) {
 			current = true;
 		},
 		p(ctx, [dirty]) {
-			if (/*IconComponent*/ ctx[3]) {
+			if (/*IconComponent*/ ctx[1]) {
 				if (if_block) {
 					if_block.p(ctx, dirty);
 
-					if (dirty & /*IconComponent*/ 8) {
+					if (dirty & /*IconComponent*/ 2) {
 						transition_in(if_block, 1);
 					}
 				} else {
-					if_block = create_if_block$3(ctx);
+					if_block = create_if_block$1(ctx);
 					if_block.c();
 					transition_in(if_block, 1);
 					if_block.m(if_block_anchor.parentNode, if_block_anchor);
@@ -12864,67 +12987,58 @@ function create_fragment$6(ctx) {
 	};
 }
 
-function instance$6($$self, $$props, $$invalidate) {
+function instance$5($$self, $$props, $$invalidate) {
 	let style;
 	let IconComponent;
-	let { layerId } = $$props;
 	let { props = {} } = $$props;
-	let { overrideStyle } = $$props;
 
 	$$self.$$set = $$props => {
-		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
-		if ('props' in $$props) $$invalidate(1, props = $$props.props);
-		if ('overrideStyle' in $$props) $$invalidate(2, overrideStyle = $$props.overrideStyle);
+		if ('props' in $$props) $$invalidate(0, props = $$props.props);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*props*/ 2) {
-			$$invalidate(4, style = objToStyle({
-				display: 'inline-flex',
-				alignItems: 'center',
-				overflow: 'hidden',
-				width: 'auto',
+		if ($$self.$$.dirty & /*props*/ 1) {
+			$$invalidate(2, style = objToStyle({
 				minWidth: props.size,
+				width: props.size,
 				height: props.size,
 				...toCssCommon(props)
 			}));
 		}
 
-		if ($$self.$$.dirty & /*props*/ 2) {
-			$$invalidate(3, IconComponent = ICON_VARIANTS[props.variant] ?? undefined);
+		if ($$self.$$.dirty & /*props*/ 1) {
+			$$invalidate(1, IconComponent = ICON_VARIANTS[props.variant] ?? undefined);
 		}
 	};
 
-	return [layerId, props, overrideStyle, IconComponent, style];
+	return [props, IconComponent, style];
 }
 
 class Icon extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$6, create_fragment$6, safe_not_equal, { layerId: 0, props: 1, overrideStyle: 2 });
+		init(this, options, instance$5, create_fragment$5, safe_not_equal, { props: 0 }, add_css$5);
 	}
 }
 
 /* src/components-v2/button/Button.svelte generated by Svelte v3.53.1 */
 
-function add_css(target) {
-	append_styles(target, "svelte-i9kun1", ".v2-button.svelte-i9kun1{display:inline-flex;align-content:center;justify-content:center;gap:0.65em;outline:0;transition:background-color 0.12s, border-color 0.12s, color 0.12s}.v2-button-icon.svelte-i9kun1{display:flex;align-items:center;justify-content:center;margin-left:-0.2em;margin-right:-0.2em}");
+function add_css$4(target) {
+	append_styles(target, "svelte-kz1c6t", ".v2-button.svelte-kz1c6t{display:inline-flex;align-content:center;justify-content:center;gap:0.65em;cursor:pointer;outline:0;transition:background-color 0.12s, border-color 0.12s, color 0.12s}.v2-button-icon.svelte-kz1c6t{display:flex;align-items:center;justify-content:center;margin-left:-0.2em;margin-right:-0.2em}");
 }
 
-// (128:2) {#if (props.isIcon && props.iconVariant)}
-function create_if_block$2(ctx) {
+// (126:2) {#if (props.isIcon && props.iconVariant)}
+function create_if_block(ctx) {
 	let div;
 	let icon;
 	let current;
 
 	icon = new Icon({
 			props: {
-				layerId: undefined,
-				overrideStyle: undefined,
 				props: {
-					variant: /*props*/ ctx[1].iconVariant,
+					variant: /*props*/ ctx[0].iconVariant,
 					size: '1em',
-					color: /*VARIANTS*/ ctx[4].color[/*props*/ ctx[1].color ?? 'default'].color
+					color: /*VARIANTS*/ ctx[2].color[/*props*/ ctx[0].color ?? 'default'].color
 				}
 			}
 		});
@@ -12933,7 +13047,7 @@ function create_if_block$2(ctx) {
 		c() {
 			div = element("div");
 			create_component(icon.$$.fragment);
-			attr(div, "class", "v2-button-icon svelte-i9kun1");
+			attr(div, "class", "v2-button-icon svelte-kz1c6t");
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
@@ -12943,10 +13057,10 @@ function create_if_block$2(ctx) {
 		p(ctx, dirty) {
 			const icon_changes = {};
 
-			if (dirty & /*props*/ 2) icon_changes.props = {
-				variant: /*props*/ ctx[1].iconVariant,
+			if (dirty & /*props*/ 1) icon_changes.props = {
+				variant: /*props*/ ctx[0].iconVariant,
 				size: '1em',
-				color: /*VARIANTS*/ ctx[4].color[/*props*/ ctx[1].color ?? 'default'].color
+				color: /*VARIANTS*/ ctx[2].color[/*props*/ ctx[0].color ?? 'default'].color
 			};
 
 			icon.$set(icon_changes);
@@ -12967,17 +13081,16 @@ function create_if_block$2(ctx) {
 	};
 }
 
-function create_fragment$5(ctx) {
+function create_fragment$4(ctx) {
 	let button;
 	let t0;
 	let span;
-	let t1_value = /*props*/ ctx[1].label + "";
+	let t1_value = /*props*/ ctx[0].label + "";
 	let t1;
-	let button_style_value;
 	let current;
 	let mounted;
 	let dispose;
-	let if_block = /*props*/ ctx[1].isIcon && /*props*/ ctx[1].iconVariant && create_if_block$2(ctx);
+	let if_block = /*props*/ ctx[0].isIcon && /*props*/ ctx[0].iconVariant && create_if_block(ctx);
 
 	return {
 		c() {
@@ -12986,9 +13099,8 @@ function create_fragment$5(ctx) {
 			t0 = space();
 			span = element("span");
 			t1 = text(t1_value);
-			attr(button, "data-layer-id", /*layerId*/ ctx[0]);
-			attr(button, "style", button_style_value = [/*style*/ ctx[3], /*overrideStyle*/ ctx[2]].join(' '));
-			attr(button, "class", "v2-button svelte-i9kun1");
+			attr(button, "style", /*style*/ ctx[1]);
+			attr(button, "class", "v2-button svelte-kz1c6t");
 		},
 		m(target, anchor) {
 			insert(target, button, anchor);
@@ -12999,20 +13111,20 @@ function create_fragment$5(ctx) {
 			current = true;
 
 			if (!mounted) {
-				dispose = listen(button, "click", checkStopPropagation('click', /*handleClick*/ ctx[5]));
+				dispose = listen(button, "click", checkStopPropagation('click', /*handleClick*/ ctx[3]));
 				mounted = true;
 			}
 		},
 		p(ctx, [dirty]) {
-			if (/*props*/ ctx[1].isIcon && /*props*/ ctx[1].iconVariant) {
+			if (/*props*/ ctx[0].isIcon && /*props*/ ctx[0].iconVariant) {
 				if (if_block) {
 					if_block.p(ctx, dirty);
 
-					if (dirty & /*props*/ 2) {
+					if (dirty & /*props*/ 1) {
 						transition_in(if_block, 1);
 					}
 				} else {
-					if_block = create_if_block$2(ctx);
+					if_block = create_if_block(ctx);
 					if_block.c();
 					transition_in(if_block, 1);
 					if_block.m(button, t0);
@@ -13027,14 +13139,10 @@ function create_fragment$5(ctx) {
 				check_outros();
 			}
 
-			if ((!current || dirty & /*props*/ 2) && t1_value !== (t1_value = /*props*/ ctx[1].label + "")) set_data(t1, t1_value);
-
-			if (!current || dirty & /*layerId*/ 1) {
-				attr(button, "data-layer-id", /*layerId*/ ctx[0]);
-			}
+			if ((!current || dirty & /*props*/ 1) && t1_value !== (t1_value = /*props*/ ctx[0].label + "")) set_data(t1, t1_value);
 
-			if (!current || dirty & /*style, overrideStyle*/ 12 && button_style_value !== (button_style_value = [/*style*/ ctx[3], /*overrideStyle*/ ctx[2]].join(' '))) {
-				attr(button, "style", button_style_value);
+			if (!current || dirty & /*style*/ 2) {
+				attr(button, "style", /*style*/ ctx[1]);
 			}
 		},
 		i(local) {
@@ -13055,14 +13163,12 @@ function create_fragment$5(ctx) {
 	};
 }
 
-function instance$5($$self, $$props, $$invalidate) {
+function instance$4($$self, $$props, $$invalidate) {
 	let style;
-	let { layerId = '' } = $$props;
 	let { onClick = { operation: 'none', args: [] } } = $$props;
 	let { eventName = '' } = $$props;
 	let { eventValue = undefined } = $$props;
 	let { props = {} } = $$props;
-	let { overrideStyle } = $$props;
 
 	const VARIANTS = {
 		size: {
@@ -13095,7 +13201,7 @@ function instance$5($$self, $$props, $$invalidate) {
 			large: {
 				minHeight: '48px',
 				paddingInline: '32px',
-				fontSize: '16px',
+				fontSize: '14px',
 				paddingBlock: '10px',
 				lineHeight: 1.5,
 				borderRadius: '4px'
@@ -13152,17 +13258,15 @@ function instance$5($$self, $$props, $$invalidate) {
 	}
 
 	$$self.$$set = $$props => {
-		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
-		if ('onClick' in $$props) $$invalidate(6, onClick = $$props.onClick);
-		if ('eventName' in $$props) $$invalidate(7, eventName = $$props.eventName);
-		if ('eventValue' in $$props) $$invalidate(8, eventValue = $$props.eventValue);
-		if ('props' in $$props) $$invalidate(1, props = $$props.props);
-		if ('overrideStyle' in $$props) $$invalidate(2, overrideStyle = $$props.overrideStyle);
+		if ('onClick' in $$props) $$invalidate(4, onClick = $$props.onClick);
+		if ('eventName' in $$props) $$invalidate(5, eventName = $$props.eventName);
+		if ('eventValue' in $$props) $$invalidate(6, eventValue = $$props.eventValue);
+		if ('props' in $$props) $$invalidate(0, props = $$props.props);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*props*/ 2) {
-			$$invalidate(3, style = objToStyle({
+		if ($$self.$$.dirty & /*props*/ 1) {
+			$$invalidate(1, style = objToStyle({
 				display: 'inline-flex',
 				gap: '0.65em',
 				alignItems: 'center',
@@ -13183,17 +13287,7 @@ function instance$5($$self, $$props, $$invalidate) {
 		}
 	};
 
-	return [
-		layerId,
-		props,
-		overrideStyle,
-		style,
-		VARIANTS,
-		handleClick,
-		onClick,
-		eventName,
-		eventValue
-	];
+	return [props, style, VARIANTS, handleClick, onClick, eventName, eventValue];
 }
 
 class Button extends SvelteComponent {
@@ -13203,572 +13297,393 @@ class Button extends SvelteComponent {
 		init(
 			this,
 			options,
-			instance$5,
-			create_fragment$5,
+			instance$4,
+			create_fragment$4,
 			safe_not_equal,
 			{
-				layerId: 0,
-				onClick: 6,
-				eventName: 7,
-				eventValue: 8,
-				props: 1,
-				overrideStyle: 2
+				onClick: 4,
+				eventName: 5,
+				eventValue: 6,
+				props: 0
 			},
-			add_css
+			add_css$4
 		);
 	}
 }
 
-/* src/components-v2/layout/Layout.svelte generated by Svelte v3.53.1 */
-
-function create_fragment$4(ctx) {
-	let div;
-	let current;
-	const default_slot_template = /*#slots*/ ctx[4].default;
-	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[3], null);
-
-	return {
-		c() {
-			div = element("div");
-			if (default_slot) default_slot.c();
-			attr(div, "data-layer-id", /*layerId*/ ctx[0]);
-			attr(div, "data-component-name", "layout");
-			attr(div, "style", /*style*/ ctx[1]);
-		},
-		m(target, anchor) {
-			insert(target, div, anchor);
-
-			if (default_slot) {
-				default_slot.m(div, null);
-			}
-
-			current = true;
-		},
-		p(ctx, [dirty]) {
-			if (default_slot) {
-				if (default_slot.p && (!current || dirty & /*$$scope*/ 8)) {
-					update_slot_base(
-						default_slot,
-						default_slot_template,
-						ctx,
-						/*$$scope*/ ctx[3],
-						!current
-						? get_all_dirty_from_scope(/*$$scope*/ ctx[3])
-						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[3], dirty, null),
-						null
-					);
-				}
-			}
-
-			if (!current || dirty & /*layerId*/ 1) {
-				attr(div, "data-layer-id", /*layerId*/ ctx[0]);
-			}
-
-			if (!current || dirty & /*style*/ 2) {
-				attr(div, "style", /*style*/ ctx[1]);
-			}
-		},
-		i(local) {
-			if (current) return;
-			transition_in(default_slot, local);
-			current = true;
-		},
-		o(local) {
-			transition_out(default_slot, local);
-			current = false;
-		},
-		d(detaching) {
-			if (detaching) detach(div);
-			if (default_slot) default_slot.d(detaching);
-		}
-	};
-}
-
-function instance$4($$self, $$props, $$invalidate) {
-	let style;
-	let { $$slots: slots = {}, $$scope } = $$props;
-	let { layerId = undefined } = $$props;
-	let { props = {} } = $$props;
-
-	$$self.$$set = $$props => {
-		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
-		if ('props' in $$props) $$invalidate(2, props = $$props.props);
-		if ('$$scope' in $$props) $$invalidate(3, $$scope = $$props.$$scope);
-	};
-
-	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*props*/ 4) {
-			$$invalidate(1, style = objToStyle({
-				display: props.display ?? 'flex',
-				flexDirection: props.direction,
-				alignItems: props.align,
-				justifyContent: props.justify,
-				rowGap: props.rowGap,
-				columnGap: props.columnGap,
-				width: props.width,
-				...toCssShadow(props),
-				...toCssRadius(props),
-				...toCssBackgroundImage(props.backgroundImage),
-				...toCssBackgroundColor(props),
-				...toCssCommon(props),
-				...toCssPadding(props),
-				...toCssBorder(props)
-			}));
-		}
-	};
+const BUTTON_SIZE = {
+    extra_small: 'XSmall',
+    small: 'Small',
+    medium: 'Medium',
+    large: 'Large',
+    extra_large: 'XLarge',
+};
+const BUTTON_COLOR = {
+    default: 'デフォルト',
+    theme: 'テーマカラー',
+    alert: 'アラート',
+    transparent: '背景なし',
+};
+const BUTTON_ROUND = {
+    default: 'デフォルト',
+    none: 'なし',
+    fulled: '円形',
+};
+const BUTTON_LINK_TARGET = {
+    _self: '画面内遷移',
+    _blank: '別タブで開く',
+};
+const BUTTON_ICON_ANGLE = {
+    row: '左側',
+    'row-reverse': '右側',
+};
 
-	return [layerId, style, props, $$scope, slots];
-}
+/* src/components-v2/close-button/CloseButton.svelte generated by Svelte v3.53.1 */
 
-class Layout extends SvelteComponent {
-	constructor(options) {
-		super();
-		init(this, options, instance$4, create_fragment$4, safe_not_equal, { layerId: 0, props: 2 });
-	}
+function add_css$3(target) {
+	append_styles(target, "svelte-1dgpo5m", ".close-button.svelte-1dgpo5m{display:inline-flex;align-items:center;justify-content:center;border-radius:100%;background:none;border:0;outline:0;transition:background-color 0.12s, border-color 0.12s, color 0.12s}");
 }
 
-/* src/components-v2/text/Text.svelte generated by Svelte v3.53.1 */
-
 function create_fragment$3(ctx) {
-	let p;
+	let button;
+	let svg;
+	let path;
 
 	return {
 		c() {
-			p = element("p");
-			attr(p, "data-layer-id", /*layerId*/ ctx[0]);
-			attr(p, "style", /*style*/ ctx[1]);
+			button = element("button");
+			svg = svg_element("svg");
+			path = svg_element("path");
+			attr(path, "d", "M 9.15625 6.3125 L 6.3125 9.15625 L 22.15625 25 L 6.21875 40.96875 L 9.03125 43.78125 L 25 27.84375 L 40.9375 43.78125 L 43.78125 40.9375 L 27.84375 25 L 43.6875 9.15625 L 40.84375 6.3125 L 25 22.15625 Z");
+			attr(svg, "xmlns", "http://www.w3.org/2000/svg");
+			set_style(svg, "width", "75%");
+			set_style(svg, "height", "75%");
+			attr(svg, "viewBox", "0 0 50 50");
+			attr(svg, "fill", "#666666");
+			attr(button, "class", "close-button svelte-1dgpo5m");
+			attr(button, "style", /*style*/ ctx[0]);
 		},
 		m(target, anchor) {
-			insert(target, p, anchor);
-			p.innerHTML = /*escapedHTML*/ ctx[2];
+			insert(target, button, anchor);
+			append(button, svg);
+			append(svg, path);
 		},
 		p(ctx, [dirty]) {
-			if (dirty & /*escapedHTML*/ 4) p.innerHTML = /*escapedHTML*/ ctx[2];
-			if (dirty & /*layerId*/ 1) {
-				attr(p, "data-layer-id", /*layerId*/ ctx[0]);
-			}
-
-			if (dirty & /*style*/ 2) {
-				attr(p, "style", /*style*/ ctx[1]);
+			if (dirty & /*style*/ 1) {
+				attr(button, "style", /*style*/ ctx[0]);
 			}
 		},
 		i: noop,
 		o: noop,
 		d(detaching) {
-			if (detaching) detach(p);
+			if (detaching) detach(button);
 		}
 	};
 }
 
 function instance$3($$self, $$props, $$invalidate) {
-	let escapedHTML;
 	let style;
-	let { layerId } = $$props;
-	let { props = { content: '' } } = $$props;
+	let { props = {} } = $$props;
+	const size = props.size ?? 24;
 
 	$$self.$$set = $$props => {
-		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
-		if ('props' in $$props) $$invalidate(3, props = $$props.props);
+		if ('props' in $$props) $$invalidate(1, props = $$props.props);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*props*/ 8) {
-			$$invalidate(2, escapedHTML = props.content.replace(/&/g, '&lt;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#x27;').replace(/\n/g, '<br />'));
-		}
-
-		if ($$self.$$.dirty & /*props*/ 8) {
-			$$invalidate(1, style = objToStyle({
-				margin: 0,
-				position: props?.position ?? 'static',
-				fontWeight: props.fontWeight,
-				fontSize: props.fontSize,
-				color: props.color,
-				textAlign: props.align,
-				wordBreak: 'break-all',
-				width: props.width,
-				...toCssRadius(props),
-				...toCssBackgroundColor(props),
-				...toCssCommon(props),
-				...toCssPosition(props),
-				...toCssBorder(props)
+		if ($$self.$$.dirty & /*props*/ 2) {
+			$$invalidate(0, style = objToStyle({
+				width: `${size}px`,
+				height: `${size}px`,
+				...props.bordered && { border: '1px solid #666' },
+				...toCssCommon(props)
 			}));
 		}
 	};
 
-	return [layerId, style, escapedHTML, props];
+	return [style, props];
 }
 
-class Text extends SvelteComponent {
+class CloseButton extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$3, create_fragment$3, safe_not_equal, { layerId: 0, props: 3 });
+		init(this, options, instance$3, create_fragment$3, safe_not_equal, { props: 1 }, add_css$3);
 	}
 }
 
-/* src/components-v2/avatar/Avatar.svelte generated by Svelte v3.53.1 */
+/* src/components-v2/image/Image.svelte generated by Svelte v3.53.1 */
 
-function create_if_block$1(ctx) {
+function add_css$2(target) {
+	append_styles(target, "svelte-vojroc", ".image.svelte-vojroc{display:flex;max-width:100%;align-items:center;justify-content:center;overflow:hidden}.image-object.svelte-vojroc{width:100%;overflow:hidden}.image-img.svelte-vojroc{vertical-align:top;width:100%;height:100%;object-fit:cover;user-select:none}");
+}
+
+function create_fragment$2(ctx) {
 	let div;
+	let object;
 	let img;
 	let img_src_value;
-	let div_style_value;
+	let img_alt_value;
 
 	return {
 		c() {
 			div = element("div");
+			object = element("object");
 			img = element("img");
-			if (!src_url_equal(img.src, img_src_value = /*props*/ ctx[1].image)) attr(img, "src", img_src_value);
-			attr(img, "alt", "");
-			attr(img, "style", /*imgStyle*/ ctx[3]);
-			attr(div, "data-layer-id", /*layerId*/ ctx[0]);
-			attr(div, "data-component-id", "avatar");
-			attr(div, "style", div_style_value = [/*style*/ ctx[4], /*overrideStyle*/ ctx[2]].join(' '));
+			if (!src_url_equal(img.src, img_src_value = /*props*/ ctx[0].image)) attr(img, "src", img_src_value);
+			attr(img, "alt", img_alt_value = /*props*/ ctx[0].alt);
+			attr(img, "class", "image-img svelte-vojroc");
+			attr(object, "style", /*objectStyle*/ ctx[1]);
+			attr(object, "class", "image-object svelte-vojroc");
+			attr(div, "class", "image svelte-vojroc");
+			attr(div, "style", /*style*/ ctx[2]);
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
-			append(div, img);
+			append(div, object);
+			append(object, img);
 		},
-		p(ctx, dirty) {
-			if (dirty & /*props*/ 2 && !src_url_equal(img.src, img_src_value = /*props*/ ctx[1].image)) {
+		p(ctx, [dirty]) {
+			if (dirty & /*props*/ 1 && !src_url_equal(img.src, img_src_value = /*props*/ ctx[0].image)) {
 				attr(img, "src", img_src_value);
 			}
 
-			if (dirty & /*imgStyle*/ 8) {
-				attr(img, "style", /*imgStyle*/ ctx[3]);
+			if (dirty & /*props*/ 1 && img_alt_value !== (img_alt_value = /*props*/ ctx[0].alt)) {
+				attr(img, "alt", img_alt_value);
 			}
 
-			if (dirty & /*layerId*/ 1) {
-				attr(div, "data-layer-id", /*layerId*/ ctx[0]);
+			if (dirty & /*objectStyle*/ 2) {
+				attr(object, "style", /*objectStyle*/ ctx[1]);
 			}
 
-			if (dirty & /*style, overrideStyle*/ 20 && div_style_value !== (div_style_value = [/*style*/ ctx[4], /*overrideStyle*/ ctx[2]].join(' '))) {
-				attr(div, "style", div_style_value);
-			}
-		},
-		d(detaching) {
-			if (detaching) detach(div);
-		}
-	};
-}
-
-function create_fragment$2(ctx) {
-	let if_block_anchor;
-	let if_block = /*props*/ ctx[1].image && create_if_block$1(ctx);
-
-	return {
-		c() {
-			if (if_block) if_block.c();
-			if_block_anchor = empty();
-		},
-		m(target, anchor) {
-			if (if_block) if_block.m(target, anchor);
-			insert(target, if_block_anchor, anchor);
-		},
-		p(ctx, [dirty]) {
-			if (/*props*/ ctx[1].image) {
-				if (if_block) {
-					if_block.p(ctx, dirty);
-				} else {
-					if_block = create_if_block$1(ctx);
-					if_block.c();
-					if_block.m(if_block_anchor.parentNode, if_block_anchor);
-				}
-			} else if (if_block) {
-				if_block.d(1);
-				if_block = null;
+			if (dirty & /*style*/ 4) {
+				attr(div, "style", /*style*/ ctx[2]);
 			}
 		},
 		i: noop,
 		o: noop,
 		d(detaching) {
-			if (if_block) if_block.d(detaching);
-			if (detaching) detach(if_block_anchor);
+			if (detaching) detach(div);
 		}
 	};
 }
 
 function instance$2($$self, $$props, $$invalidate) {
 	let style;
-	let imgStyle;
-	let { layerId = '' } = $$props;
+	let objectStyle;
 	let { props = {} } = $$props;
-	let { overrideStyle } = $$props;
-
-	const VARIANTS = {
-		shape: {
-			circle: { borderRadius: '100%' },
-			square: { borderRadius: '4px' }
-		}
-	};
-
-	const size = props.size ?? 64;
 
 	$$self.$$set = $$props => {
-		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
-		if ('props' in $$props) $$invalidate(1, props = $$props.props);
-		if ('overrideStyle' in $$props) $$invalidate(2, overrideStyle = $$props.overrideStyle);
+		if ('props' in $$props) $$invalidate(0, props = $$props.props);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*props*/ 2) {
-			$$invalidate(4, style = objToStyle({
-				display: 'flex',
-				alignItems: 'center',
-				overflow: 'hidden',
-				flexShrink: 0,
-				width: `${size}px`,
-				height: `${size}px`,
-				...VARIANTS.shape[props.shape ?? 'square'],
-				...props.bordered && { border: `1px solid #dbdbdb` },
+		if ($$self.$$.dirty & /*props*/ 1) {
+			$$invalidate(2, style = objToStyle({
+				width: props.width ?? '100%',
 				...toCssCommon(props)
 			}));
 		}
-	};
 
-	$$invalidate(3, imgStyle = objToStyle({
-		width: '100%',
-		height: '100%',
-		objectFit: 'cover'
-	}));
+		if ($$self.$$.dirty & /*props*/ 1) {
+			$$invalidate(1, objectStyle = objToStyle({ aspectRatio: props.aspect }));
+		}
+	};
 
-	return [layerId, props, overrideStyle, imgStyle, style];
+	return [props, objectStyle, style];
 }
 
-class Avatar extends SvelteComponent {
+class Image extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$2, create_fragment$2, safe_not_equal, { layerId: 0, props: 1, overrideStyle: 2 });
+		init(this, options, instance$2, create_fragment$2, safe_not_equal, { props: 0 }, add_css$2);
 	}
 }
 
-/* src/components-v2/image/Image.svelte generated by Svelte v3.53.1 */
+/* src/components-v2/layout/Layout.svelte generated by Svelte v3.53.1 */
 
-function create_if_block(ctx) {
+function add_css$1(target) {
+	append_styles(target, "svelte-1g6q4hu", ".layout.svelte-1g6q4hu{margin:0}");
+}
+
+function create_fragment$1(ctx) {
 	let div;
-	let object;
-	let img;
-	let img_src_value;
-	let div_style_value;
+	let current;
+	const default_slot_template = /*#slots*/ ctx[3].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[2], null);
 
 	return {
 		c() {
 			div = element("div");
-			object = element("object");
-			img = element("img");
-			if (!src_url_equal(img.src, img_src_value = /*props*/ ctx[1].image)) attr(img, "src", img_src_value);
-			attr(img, "alt", "");
-			attr(img, "style", /*imgStyle*/ ctx[3]);
-			attr(object, "style", /*objectStyle*/ ctx[4]);
-			attr(object, "title", "");
-			attr(div, "data-layer-id", /*layerId*/ ctx[0]);
-			attr(div, "style", div_style_value = [/*style*/ ctx[5], /*overrideStyle*/ ctx[2]].join(' '));
+			if (default_slot) default_slot.c();
+			attr(div, "class", "layout svelte-1g6q4hu");
+			attr(div, "style", /*style*/ ctx[0]);
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
-			append(div, object);
-			append(object, img);
-		},
-		p(ctx, dirty) {
-			if (dirty & /*props*/ 2 && !src_url_equal(img.src, img_src_value = /*props*/ ctx[1].image)) {
-				attr(img, "src", img_src_value);
-			}
-
-			if (dirty & /*imgStyle*/ 8) {
-				attr(img, "style", /*imgStyle*/ ctx[3]);
-			}
 
-			if (dirty & /*objectStyle*/ 16) {
-				attr(object, "style", /*objectStyle*/ ctx[4]);
+			if (default_slot) {
+				default_slot.m(div, null);
 			}
 
-			if (dirty & /*layerId*/ 1) {
-				attr(div, "data-layer-id", /*layerId*/ ctx[0]);
+			current = true;
+		},
+		p(ctx, [dirty]) {
+			if (default_slot) {
+				if (default_slot.p && (!current || dirty & /*$$scope*/ 4)) {
+					update_slot_base(
+						default_slot,
+						default_slot_template,
+						ctx,
+						/*$$scope*/ ctx[2],
+						!current
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[2])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[2], dirty, null),
+						null
+					);
+				}
 			}
 
-			if (dirty & /*style, overrideStyle*/ 36 && div_style_value !== (div_style_value = [/*style*/ ctx[5], /*overrideStyle*/ ctx[2]].join(' '))) {
-				attr(div, "style", div_style_value);
+			if (!current || dirty & /*style*/ 1) {
+				attr(div, "style", /*style*/ ctx[0]);
 			}
 		},
-		d(detaching) {
-			if (detaching) detach(div);
-		}
-	};
-}
-
-function create_fragment$1(ctx) {
-	let if_block_anchor;
-	let if_block = /*props*/ ctx[1].image && create_if_block(ctx);
-
-	return {
-		c() {
-			if (if_block) if_block.c();
-			if_block_anchor = empty();
-		},
-		m(target, anchor) {
-			if (if_block) if_block.m(target, anchor);
-			insert(target, if_block_anchor, anchor);
+		i(local) {
+			if (current) return;
+			transition_in(default_slot, local);
+			current = true;
 		},
-		p(ctx, [dirty]) {
-			if (/*props*/ ctx[1].image) {
-				if (if_block) {
-					if_block.p(ctx, dirty);
-				} else {
-					if_block = create_if_block(ctx);
-					if_block.c();
-					if_block.m(if_block_anchor.parentNode, if_block_anchor);
-				}
-			} else if (if_block) {
-				if_block.d(1);
-				if_block = null;
-			}
+		o(local) {
+			transition_out(default_slot, local);
+			current = false;
 		},
-		i: noop,
-		o: noop,
 		d(detaching) {
-			if (if_block) if_block.d(detaching);
-			if (detaching) detach(if_block_anchor);
+			if (detaching) detach(div);
+			if (default_slot) default_slot.d(detaching);
 		}
 	};
 }
 
 function instance$1($$self, $$props, $$invalidate) {
 	let style;
-	let objectStyle;
-	let imgStyle;
-	let { layerId } = $$props;
+	let { $$slots: slots = {}, $$scope } = $$props;
 	let { props = {} } = $$props;
-	let { overrideStyle } = $$props;
 
 	$$self.$$set = $$props => {
-		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
 		if ('props' in $$props) $$invalidate(1, props = $$props.props);
-		if ('overrideStyle' in $$props) $$invalidate(2, overrideStyle = $$props.overrideStyle);
+		if ('$$scope' in $$props) $$invalidate(2, $$scope = $$props.$$scope);
 	};
 
 	$$self.$$.update = () => {
 		if ($$self.$$.dirty & /*props*/ 2) {
-			$$invalidate(5, style = objToStyle({
+			$$invalidate(0, style = objToStyle({
+				display: props.display ?? 'flex',
+				flexDirection: props.direction,
+				alignItems: props.align,
+				justifyContent: props.justify,
+				rowGap: props.rowGap,
+				columnGap: props.columnGap,
 				width: props.width,
-				display: 'flex',
-				maxWidth: '100%',
-				alignItems: 'center',
-				justifyContent: 'center',
-				overflow: 'hidden',
-				wordBreak: 'break-all',
-				...toCssCommon(props)
-			}));
-		}
-
-		if ($$self.$$.dirty & /*props*/ 2) {
-			$$invalidate(4, objectStyle = objToStyle({
-				width: '100%',
-				aspectRatio: props.aspect,
-				overflow: 'hidden'
+				...toCssShadow(props),
+				...toCssRadius(props),
+				...toCssBackgroundImage(props),
+				...toCssBackgroundColor(props),
+				...toCssCommon(props),
+				...toCssPadding(props),
+				...toCssBorder(props)
 			}));
 		}
 	};
 
-	$$invalidate(3, imgStyle = objToStyle({
-		width: '100%',
-		height: '100%',
-		objectFit: 'cover',
-		userSelect: 'none'
-	}));
-
-	return [layerId, props, overrideStyle, imgStyle, objectStyle, style];
+	return [style, props, $$scope, slots];
 }
 
-class Image extends SvelteComponent {
+class Layout extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance$1, create_fragment$1, safe_not_equal, { layerId: 0, props: 1, overrideStyle: 2 });
+		init(this, options, instance$1, create_fragment$1, safe_not_equal, { props: 1 }, add_css$1);
 	}
 }
 
-/* src/components-v2/close-button/CloseButton.svelte generated by Svelte v3.53.1 */
+const LAYOUT_DISPLAY_TYPE = ['inline-flex', 'flex', 'block'];
+const LAYOUT_DIRECTION = ['column', 'column-reverse', 'row', 'row-reverse'];
+const LAYOUT_ALIGN = ['flex-start', 'center', 'flex-end'];
+const LAYOUT_JUSTIFY = ['flex-start', 'center', 'flex-end', 'space-between'];
+
+/* src/components-v2/text/Text.svelte generated by Svelte v3.53.1 */
+
+function add_css(target) {
+	append_styles(target, "svelte-1vl0c87", ".text.svelte-1vl0c87{margin:0;word-break:break-all}");
+}
 
 function create_fragment(ctx) {
-	let button;
-	let svg;
-	let path;
-	let button_style_value;
+	let p;
 
 	return {
 		c() {
-			button = element("button");
-			svg = svg_element("svg");
-			path = svg_element("path");
-			attr(path, "d", "M 9.15625 6.3125 L 6.3125 9.15625 L 22.15625 25 L 6.21875 40.96875 L 9.03125 43.78125 L 25 27.84375 L 40.9375 43.78125 L 43.78125 40.9375 L 27.84375 25 L 43.6875 9.15625 L 40.84375 6.3125 L 25 22.15625 Z");
-			attr(svg, "xmlns", "http://www.w3.org/2000/svg");
-			set_style(svg, "width", "75%");
-			set_style(svg, "height", "75%");
-			attr(svg, "viewBox", "0 0 50 50");
-			attr(svg, "fill", "#666666");
-			attr(button, "data-layer-id", /*layerId*/ ctx[0]);
-			attr(button, "style", button_style_value = [/*style*/ ctx[2], /*overrideStyle*/ ctx[1]].join(' '));
+			p = element("p");
+			attr(p, "class", "text svelte-1vl0c87");
+			attr(p, "style", /*style*/ ctx[0]);
 		},
 		m(target, anchor) {
-			insert(target, button, anchor);
-			append(button, svg);
-			append(svg, path);
+			insert(target, p, anchor);
+			p.innerHTML = /*escapedHTML*/ ctx[1];
 		},
 		p(ctx, [dirty]) {
-			if (dirty & /*layerId*/ 1) {
-				attr(button, "data-layer-id", /*layerId*/ ctx[0]);
-			}
-
-			if (dirty & /*style, overrideStyle*/ 6 && button_style_value !== (button_style_value = [/*style*/ ctx[2], /*overrideStyle*/ ctx[1]].join(' '))) {
-				attr(button, "style", button_style_value);
+			if (dirty & /*escapedHTML*/ 2) p.innerHTML = /*escapedHTML*/ ctx[1];
+			if (dirty & /*style*/ 1) {
+				attr(p, "style", /*style*/ ctx[0]);
 			}
 		},
 		i: noop,
 		o: noop,
 		d(detaching) {
-			if (detaching) detach(button);
+			if (detaching) detach(p);
 		}
 	};
 }
 
 function instance($$self, $$props, $$invalidate) {
+	let escapedHTML;
 	let style;
-	let { layerId } = $$props;
-	let { props = {} } = $$props;
-	let { overrideStyle } = $$props;
-	const size = props.size ?? 24;
+	let { props = { content: '' } } = $$props;
 
 	$$self.$$set = $$props => {
-		if ('layerId' in $$props) $$invalidate(0, layerId = $$props.layerId);
-		if ('props' in $$props) $$invalidate(3, props = $$props.props);
-		if ('overrideStyle' in $$props) $$invalidate(1, overrideStyle = $$props.overrideStyle);
+		if ('props' in $$props) $$invalidate(2, props = $$props.props);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*props*/ 8) {
-			$$invalidate(2, style = objToStyle({
-				display: 'inline-flex',
-				alignItems: 'center',
-				justifyContent: 'center',
-				borderRadius: '100%',
-				background: 'none',
-				border: 0,
-				outline: 0,
-				transition: 'background-color 0.12s, border-color 0.12s, color 0.12s',
-				width: `${size}px`,
-				height: `${size}px`,
-				...props.bordered && { border: '1px solid #666' },
-				...toCssCommon(props)
+		if ($$self.$$.dirty & /*props*/ 4) {
+			$$invalidate(1, escapedHTML = props.content.replace(/&/g, '&lt;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#x27;').replace(/\n/g, '<br />'));
+		}
+
+		if ($$self.$$.dirty & /*props*/ 4) {
+			$$invalidate(0, style = objToStyle({
+				position: props?.position ?? 'static',
+				fontWeight: props.fontWeight,
+				fontSize: props.fontSize,
+				color: props.color,
+				textAlign: props.align,
+				width: props.width,
+				...toCssRadius(props),
+				...toCssBackgroundColor(props),
+				...toCssCommon(props),
+				...toCssPosition(props),
+				...toCssBorder(props)
 			}));
 		}
 	};
 
-	return [layerId, overrideStyle, style, props];
+	return [style, escapedHTML, props];
 }
 
-class CloseButton extends SvelteComponent {
+class Text extends SvelteComponent {
 	constructor(options) {
 		super();
-		init(this, options, instance, create_fragment, safe_not_equal, { layerId: 0, props: 3, overrideStyle: 1 });
+		init(this, options, instance, create_fragment, safe_not_equal, { props: 2 }, add_css);
 	}
 }
 
-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, Avatar as V2Avatar, Button as V2Button, CloseButton as V2CloseButton, Icon as V2Icon, Image as V2Image, Layout as V2Layout, Text as V2Text, 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 };
+const LAYER_TEXT_ALIGN_VALUES = ['center', 'left', 'right'];
+const LAYER_TEXT_FONT_WEIGHT_VALUES = ['bold', 'normal'];
+
+export { ACTION_HOOK_LABEL, AVATAR_SHAPE, AVATAR_SIZE, Alignments, AnimationStyles, BUTTON_COLOR, BUTTON_ICON_ANGLE, BUTTON_LINK_TARGET, BUTTON_ROUND, BUTTON_SIZE, BackgroundSizes, Box, COMPONENT_PARAMETER_TYPES, 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, ICON_PARAMS, ICON_SIZE, ICON_VARIANTS, IconElement, ImageBlock, ImageElement, Justifies, KARTE_MODAL_ROOT, LAYER_TEXT_ALIGN_VALUES, LAYER_TEXT_FONT_WEIGHT_VALUES, LAYOUT_ALIGN, LAYOUT_COMPONENT_NAMES, LAYOUT_DIRECTION, LAYOUT_DISPLAY_TYPE, LAYOUT_JUSTIFY, 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, Avatar as V2Avatar, Button as V2Button, CloseButton as V2CloseButton, Icon as V2Icon, Image as V2Image, Layout as V2Layout, Text as V2Text, 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 };