@plaidev/karte-action-sdk 1.1.206-28200003.1303b11e → 1.1.206-28204054.f9403484

package/dist/hydrate/index.es.js

@@ -6493,7 +6493,7 @@ class MovieVimeoElement extends SvelteComponent {
 /* src/components/FormTextarea.svelte generated by Svelte v3.53.1 */
 
 function add_css$g(target) {
-	append_styles(target, "svelte-kyay3k", ".textarea-wrapper.svelte-kyay3k{display:flex;align-items:center;width:100%;height:100%}.textarea.svelte-kyay3k{width:100%;resize:none}");
+	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}");
 }
 
 function create_fragment$h(ctx) {
@@ -6509,13 +6509,13 @@ function create_fragment$h(ctx) {
 			this.h();
 		},
 		l(nodes) {
-			div = claim_element(nodes, "DIV", { class: true });
+			div = claim_element(nodes, "DIV", { class: true, style: true });
 			var div_nodes = children(div);
 
 			textarea = claim_element(div_nodes, "TEXTAREA", {
 				class: true,
-				rows: true,
-				placeholder: true
+				placeholder: true,
+				style: true
 			});
 
 			children(textarea).forEach(detach);
@@ -6523,37 +6523,42 @@ function create_fragment$h(ctx) {
 			this.h();
 		},
 		h() {
-			attr(textarea, "class", "textarea svelte-kyay3k");
-			textarea.value = /*$value*/ ctx[3];
-			textarea.required = /*required*/ ctx[0];
-			attr(textarea, "rows", /*rows*/ ctx[1]);
-			attr(textarea, "placeholder", /*placeholder*/ ctx[2]);
-			attr(div, "class", "textarea-wrapper svelte-kyay3k");
+			attr(textarea, "class", "textarea svelte-zxvkkc");
+			textarea.value = /*$value*/ ctx[4];
+			textarea.required = /*required*/ ctx[1];
+			attr(textarea, "placeholder", /*placeholder*/ ctx[0]);
+			attr(textarea, "style", /*style*/ ctx[3]);
+			attr(div, "class", "textarea-wrapper svelte-zxvkkc");
+			attr(div, "style", /*styleVariables*/ ctx[2]);
 		},
 		m(target, anchor) {
 			insert_hydration(target, div, anchor);
 			append_hydration(div, textarea);
 
 			if (!mounted) {
-				dispose = listen(textarea, "input", /*handleInput*/ ctx[5]);
+				dispose = listen(textarea, "input", /*handleInput*/ ctx[6]);
 				mounted = true;
 			}
 		},
 		p(ctx, [dirty]) {
-			if (dirty & /*$value*/ 8) {
-				textarea.value = /*$value*/ ctx[3];
+			if (dirty & /*$value*/ 16) {
+				textarea.value = /*$value*/ ctx[4];
 			}
 
-			if (dirty & /*required*/ 1) {
-				textarea.required = /*required*/ ctx[0];
+			if (dirty & /*required*/ 2) {
+				textarea.required = /*required*/ ctx[1];
 			}
 
-			if (dirty & /*rows*/ 2) {
-				attr(textarea, "rows", /*rows*/ ctx[1]);
+			if (dirty & /*placeholder*/ 1) {
+				attr(textarea, "placeholder", /*placeholder*/ ctx[0]);
 			}
 
-			if (dirty & /*placeholder*/ 4) {
-				attr(textarea, "placeholder", /*placeholder*/ ctx[2]);
+			if (dirty & /*style*/ 8) {
+				attr(textarea, "style", /*style*/ ctx[3]);
+			}
+
+			if (dirty & /*styleVariables*/ 4) {
+				attr(div, "style", /*styleVariables*/ ctx[2]);
 			}
 		},
 		i: noop,
@@ -6567,11 +6572,17 @@ function create_fragment$h(ctx) {
 }
 
 function instance$h($$self, $$props, $$invalidate) {
+	let style;
+	let styleVariables;
 	let $value;
 	let { name = '' } = $$props;
+	let { placeholder = '回答を入力してください' } = $$props;
 	let { required = true } = $$props;
-	let { rows = 2 } = $$props;
-	let { placeholder = '' } = $$props;
+	let { _style = '' } = $$props;
+	let { _focusStyle = 'border-width: 2px; border-color: #2aab9f; border-style: solid' } = $$props;
+	let { font = SYSTEM_FONT } = $$props;
+	let { _textStyle = '' } = $$props;
+	let { _placeholderStyle = 'color: #ccc;' } = $$props;
 	const { path: statePath } = getStateItemContext();
 
 	const value = registerInput({
@@ -6583,7 +6594,7 @@ function instance$h($$self, $$props, $$invalidate) {
 		}
 	});
 
-	component_subscribe($$self, value, value => $$invalidate(3, $value = value));
+	component_subscribe($$self, value, value => $$invalidate(4, $value = value));
 
 	function handleInput(event) {
 		const updated = event.target.value;
@@ -6591,13 +6602,54 @@ function instance$h($$self, $$props, $$invalidate) {
 	}
 
 	$$self.$$set = $$props => {
-		if ('name' in $$props) $$invalidate(6, name = $$props.name);
-		if ('required' in $$props) $$invalidate(0, required = $$props.required);
-		if ('rows' in $$props) $$invalidate(1, rows = $$props.rows);
-		if ('placeholder' in $$props) $$invalidate(2, placeholder = $$props.placeholder);
+		if ('name' in $$props) $$invalidate(7, name = $$props.name);
+		if ('placeholder' in $$props) $$invalidate(0, placeholder = $$props.placeholder);
+		if ('required' in $$props) $$invalidate(1, required = $$props.required);
+		if ('_style' in $$props) $$invalidate(8, _style = $$props._style);
+		if ('_focusStyle' in $$props) $$invalidate(9, _focusStyle = $$props._focusStyle);
+		if ('font' in $$props) $$invalidate(10, font = $$props.font);
+		if ('_textStyle' in $$props) $$invalidate(11, _textStyle = $$props._textStyle);
+		if ('_placeholderStyle' in $$props) $$invalidate(12, _placeholderStyle = $$props._placeholderStyle);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*font*/ 1024) {
+			addFont(font);
+		}
+
+		if ($$self.$$.dirty & /*_style, _textStyle, font*/ 3328) {
+			$$invalidate(3, style = [..._style.split(';'), ..._textStyle.split(';'), `font-family:${font}`].join(';'));
+		}
+
+		if ($$self.$$.dirty & /*_focusStyle, _placeholderStyle*/ 4608) {
+			$$invalidate(2, styleVariables = (() => {
+				const variables = {};
+				const focusStyleObj = parseStyle(_focusStyle);
+				const placeholderStyle = parseStyle(_placeholderStyle);
+				if (focusStyleObj['border-width']) variables['--focus-border-width'] = focusStyleObj['border-width'];
+				if (focusStyleObj['border-color']) variables['--focus-border-color'] = focusStyleObj['border-color'];
+				if (focusStyleObj['border-style']) variables['--focus-border-style'] = focusStyleObj['border-style'];
+				if (placeholderStyle.color) variables['--placeholder-color'] = placeholderStyle.color;
+				return stringifyStyleObj(variables);
+			})());
+		}
 	};
 
-	return [required, rows, placeholder, $value, value, handleInput, name];
+	return [
+		placeholder,
+		required,
+		styleVariables,
+		style,
+		$value,
+		value,
+		handleInput,
+		name,
+		_style,
+		_focusStyle,
+		font,
+		_textStyle,
+		_placeholderStyle
+	];
 }
 
 class FormTextarea extends SvelteComponent {
@@ -6611,10 +6663,14 @@ class FormTextarea extends SvelteComponent {
 			create_fragment$h,
 			safe_not_equal,
 			{
-				name: 6,
-				required: 0,
-				rows: 1,
-				placeholder: 2
+				name: 7,
+				placeholder: 0,
+				required: 1,
+				_style: 8,
+				_focusStyle: 9,
+				font: 10,
+				_textStyle: 11,
+				_placeholderStyle: 12
 			},
 			add_css$g
 		);
@@ -6629,12 +6685,12 @@ function add_css$f(target) {
 
 function get_each_context$5(ctx, list, i) {
 	const child_ctx = ctx.slice();
-	child_ctx[16] = list[i];
-	child_ctx[18] = i;
+	child_ctx[17] = list[i];
+	child_ctx[19] = i;
 	return child_ctx;
 }
 
-// (98:2) {#each _options as option, i}
+// (99:2) {#each _options as option, i}
 function create_each_block$5(ctx) {
 	let label;
 	let input;
@@ -6642,8 +6698,9 @@ function create_each_block$5(ctx) {
 	let input_checked_value;
 	let t0;
 	let span;
-	let t1_value = /*option*/ ctx[16] + "";
+	let t1_value = /*option*/ ctx[17] + "";
 	let t1;
+	let span_style_value;
 	let t2;
 	let mounted;
 	let dispose;
@@ -6683,10 +6740,10 @@ function create_each_block$5(ctx) {
 			attr(input, "class", "radio-button-input svelte-17s08g");
 			attr(input, "style", /*buttonStyle*/ ctx[5]);
 			attr(input, "name", /*name*/ ctx[0]);
-			input.value = input_value_value = /*option*/ ctx[16];
-			input.checked = input_checked_value = /*option*/ ctx[16] === /*_value*/ ctx[3];
+			input.value = input_value_value = /*option*/ ctx[17];
+			input.checked = input_checked_value = /*option*/ ctx[17] === /*_value*/ ctx[3];
 			attr(span, "class", "radio-button-text svelte-17s08g");
-			attr(span, "style", /*_textStyle*/ ctx[2]);
+			attr(span, "style", span_style_value = `${/*_textStyle*/ ctx[2]} ${/*fontCss*/ ctx[6]}`);
 			attr(label, "class", "radio-button svelte-17s08g");
 		},
 		m(target, anchor) {
@@ -6698,7 +6755,7 @@ function create_each_block$5(ctx) {
 			append_hydration(label, t2);
 
 			if (!mounted) {
-				dispose = listen(input, "change", /*handleChange*/ ctx[7](/*i*/ ctx[18]));
+				dispose = listen(input, "change", /*handleChange*/ ctx[8](/*i*/ ctx[19]));
 				mounted = true;
 			}
 		},
@@ -6713,18 +6770,18 @@ function create_each_block$5(ctx) {
 				attr(input, "name", /*name*/ ctx[0]);
 			}
 
-			if (dirty & /*_options*/ 16 && input_value_value !== (input_value_value = /*option*/ ctx[16])) {
+			if (dirty & /*_options*/ 16 && input_value_value !== (input_value_value = /*option*/ ctx[17])) {
 				input.value = input_value_value;
 			}
 
-			if (dirty & /*_options, _value*/ 24 && input_checked_value !== (input_checked_value = /*option*/ ctx[16] === /*_value*/ ctx[3])) {
+			if (dirty & /*_options, _value*/ 24 && input_checked_value !== (input_checked_value = /*option*/ ctx[17] === /*_value*/ ctx[3])) {
 				input.checked = input_checked_value;
 			}
 
-			if (dirty & /*_options*/ 16 && t1_value !== (t1_value = /*option*/ ctx[16] + "")) set_data(t1, t1_value);
+			if (dirty & /*_options*/ 16 && t1_value !== (t1_value = /*option*/ ctx[17] + "")) set_data(t1, t1_value);
 
-			if (dirty & /*_textStyle*/ 4) {
-				attr(span, "style", /*_textStyle*/ ctx[2]);
+			if (dirty & /*_textStyle*/ 4 && span_style_value !== (span_style_value = `${/*_textStyle*/ ctx[2]} ${/*fontCss*/ ctx[6]}`)) {
+				attr(span, "style", span_style_value);
 			}
 		},
 		d(detaching) {
@@ -6777,7 +6834,7 @@ function create_fragment$g(ctx) {
 			}
 		},
 		p(ctx, [dirty]) {
-			if (dirty & /*_textStyle, _options, buttonStyle, name, _value, handleChange*/ 189) {
+			if (dirty & /*_textStyle, fontCss, _options, buttonStyle, name, _value, handleChange*/ 381) {
 				each_value = /*_options*/ ctx[4];
 				let i;
 
@@ -6823,6 +6880,7 @@ function instance$g($$self, $$props, $$invalidate) {
 	let { required = false } = $$props;
 	let { _layoutStyle = 'flex-direction: column; gap: 0px;' } = $$props;
 	let { font = SYSTEM_FONT } = $$props;
+	const fontCss = font ? 'font-family:' + font : '';
 	let { _textStyle = 'color: #333; font-size: 12px; line-height:1.5;' } = $$props;
 	let { buttonSize = '16px' } = $$props;
 	let { buttonColor = { main: '#f0f1f1', sub: '#f0f1f1' } } = $$props;
@@ -6839,7 +6897,7 @@ function instance$g($$self, $$props, $$invalidate) {
 		}
 	});
 
-	component_subscribe($$self, value, value => $$invalidate(14, $value = value));
+	component_subscribe($$self, value, value => $$invalidate(15, $value = value));
 
 	const handleChange = index => event => {
 		if (event.target.checked) {
@@ -6849,26 +6907,26 @@ function instance$g($$self, $$props, $$invalidate) {
 
 	$$self.$$set = $$props => {
 		if ('name' in $$props) $$invalidate(0, name = $$props.name);
-		if ('options' in $$props) $$invalidate(8, options = $$props.options);
-		if ('required' in $$props) $$invalidate(9, required = $$props.required);
+		if ('options' in $$props) $$invalidate(9, options = $$props.options);
+		if ('required' in $$props) $$invalidate(10, required = $$props.required);
 		if ('_layoutStyle' in $$props) $$invalidate(1, _layoutStyle = $$props._layoutStyle);
-		if ('font' in $$props) $$invalidate(10, font = $$props.font);
+		if ('font' in $$props) $$invalidate(11, font = $$props.font);
 		if ('_textStyle' in $$props) $$invalidate(2, _textStyle = $$props._textStyle);
-		if ('buttonSize' in $$props) $$invalidate(11, buttonSize = $$props.buttonSize);
-		if ('buttonColor' in $$props) $$invalidate(12, buttonColor = $$props.buttonColor);
-		if ('buttonColorActive' in $$props) $$invalidate(13, buttonColorActive = $$props.buttonColorActive);
+		if ('buttonSize' in $$props) $$invalidate(12, buttonSize = $$props.buttonSize);
+		if ('buttonColor' in $$props) $$invalidate(13, buttonColor = $$props.buttonColor);
+		if ('buttonColorActive' in $$props) $$invalidate(14, buttonColorActive = $$props.buttonColorActive);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*font*/ 1024) {
+		if ($$self.$$.dirty & /*font*/ 2048) {
 			addFont(font);
 		}
 
-		if ($$self.$$.dirty & /*options*/ 256) {
+		if ($$self.$$.dirty & /*options*/ 512) {
 			$$invalidate(4, _options = options.split(','));
 		}
 
-		if ($$self.$$.dirty & /*buttonColor, buttonColorActive, buttonSize*/ 14336) {
+		if ($$self.$$.dirty & /*buttonColor, buttonColorActive, buttonSize*/ 28672) {
 			$$invalidate(5, buttonStyle = (() => {
 				return stringifyStyleObj({
 					'--color-main': buttonColor.main,
@@ -6880,7 +6938,7 @@ function instance$g($$self, $$props, $$invalidate) {
 			})());
 		}
 
-		if ($$self.$$.dirty & /*$value*/ 16384) {
+		if ($$self.$$.dirty & /*$value*/ 32768) {
 			$$invalidate(3, _value = $value[0]);
 		}
 	};
@@ -6892,6 +6950,7 @@ function instance$g($$self, $$props, $$invalidate) {
 		_value,
 		_options,
 		buttonStyle,
+		fontCss,
 		value,
 		handleChange,
 		options,
@@ -6916,14 +6975,14 @@ class FormRadioButtons extends SvelteComponent {
 			safe_not_equal,
 			{
 				name: 0,
-				options: 8,
-				required: 9,
+				options: 9,
+				required: 10,
 				_layoutStyle: 1,
-				font: 10,
+				font: 11,
 				_textStyle: 2,
-				buttonSize: 11,
-				buttonColor: 12,
-				buttonColorActive: 13
+				buttonSize: 12,
+				buttonColor: 13,
+				buttonColorActive: 14
 			},
 			add_css$f
 		);
@@ -6943,7 +7002,7 @@ function get_each_context$4(ctx, list, i) {
 	return child_ctx;
 }
 
-// (108:10) {:else}
+// (107:10) {:else}
 function create_else_block(ctx) {
 	let t;
 
@@ -6966,7 +7025,7 @@ function create_else_block(ctx) {
 	};
 }
 
-// (106:10) {#if option}
+// (105:10) {#if option}
 function create_if_block$2(ctx) {
 	let t_value = /*option*/ ctx[19] + "";
 	let t;
@@ -6990,7 +7049,7 @@ function create_if_block$2(ctx) {
 	};
 }
 
-// (104:6) {#each _options as option, i}
+// (103:6) {#each _options as option, i}
 function create_each_block$4(ctx) {
 	let option;
 	let t;
@@ -7232,11 +7291,12 @@ function instance$f($$self, $$props, $$invalidate) {
 			$$invalidate(1, _value = $value[0]);
 		}
 
-		if ($$self.$$.dirty & /*_style, _textStyle, _value, _placeholderStyle*/ 25602) {
+		if ($$self.$$.dirty & /*_style, _textStyle, _value, _placeholderStyle, font*/ 29698) {
 			$$invalidate(3, style = [
 				..._style.split(';'),
 				..._textStyle.split(';'),
-				...!_value ? _placeholderStyle.split(';') : []
+				...!_value ? _placeholderStyle.split(';') : [],
+				`font-family:${font}`
 			].join(';'));
 		}
 
@@ -7244,11 +7304,10 @@ function instance$f($$self, $$props, $$invalidate) {
 			$$invalidate(2, styleVariables = (() => {
 				const variables = {};
 				const focusStyleObj = parseStyle(_focusStyle);
-				const placeholderStyle = parseStyle(_placeholderStyle);
+				parseStyle(_placeholderStyle);
 				if (focusStyleObj['border-width']) variables['--focus-border-width'] = focusStyleObj['border-width'];
 				if (focusStyleObj['border-color']) variables['--focus-border-color'] = focusStyleObj['border-color'];
 				if (focusStyleObj['border-style']) variables['--focus-border-style'] = focusStyleObj['border-style'];
-				if (placeholderStyle.color) variables['--placeholder-color'] = placeholderStyle.color;
 				variables['--icon-color'] = iconColor;
 				variables['--icon-size'] = iconSize;
 				return stringifyStyleObj(variables);
@@ -7813,9 +7872,11 @@ function instance$d($$self, $$props, $$invalidate) {
 	};
 
 	function getTextButtonStyle(isActive) {
-		return isActive
-		? [...buttonStyle.split(';'), ...buttonActiveStyle.split(';')].join(';')
-		: buttonStyle;
+		return [
+			...buttonStyle.split(';'),
+			`font-family:${font}`,
+			...isActive ? buttonActiveStyle : []
+		].join(';');
 	}
 
 	$$self.$$set = $$props => {

package/dist/index.es.js

@@ -6242,7 +6242,7 @@ class MovieVimeoElement extends SvelteComponent {
 /* src/components/FormTextarea.svelte generated by Svelte v3.53.1 */
 
 function add_css$g(target) {
-	append_styles(target, "svelte-kyay3k", ".textarea-wrapper.svelte-kyay3k{display:flex;align-items:center;width:100%;height:100%}.textarea.svelte-kyay3k{width:100%;resize:none}");
+	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}");
 }
 
 function create_fragment$h(ctx) {
@@ -6255,37 +6255,42 @@ function create_fragment$h(ctx) {
 		c() {
 			div = element("div");
 			textarea = element("textarea");
-			attr(textarea, "class", "textarea svelte-kyay3k");
-			textarea.value = /*$value*/ ctx[3];
-			textarea.required = /*required*/ ctx[0];
-			attr(textarea, "rows", /*rows*/ ctx[1]);
-			attr(textarea, "placeholder", /*placeholder*/ ctx[2]);
-			attr(div, "class", "textarea-wrapper svelte-kyay3k");
+			attr(textarea, "class", "textarea svelte-zxvkkc");
+			textarea.value = /*$value*/ ctx[4];
+			textarea.required = /*required*/ ctx[1];
+			attr(textarea, "placeholder", /*placeholder*/ ctx[0]);
+			attr(textarea, "style", /*style*/ ctx[3]);
+			attr(div, "class", "textarea-wrapper svelte-zxvkkc");
+			attr(div, "style", /*styleVariables*/ ctx[2]);
 		},
 		m(target, anchor) {
 			insert(target, div, anchor);
 			append(div, textarea);
 
 			if (!mounted) {
-				dispose = listen(textarea, "input", /*handleInput*/ ctx[5]);
+				dispose = listen(textarea, "input", /*handleInput*/ ctx[6]);
 				mounted = true;
 			}
 		},
 		p(ctx, [dirty]) {
-			if (dirty & /*$value*/ 8) {
-				textarea.value = /*$value*/ ctx[3];
+			if (dirty & /*$value*/ 16) {
+				textarea.value = /*$value*/ ctx[4];
 			}
 
-			if (dirty & /*required*/ 1) {
-				textarea.required = /*required*/ ctx[0];
+			if (dirty & /*required*/ 2) {
+				textarea.required = /*required*/ ctx[1];
 			}
 
-			if (dirty & /*rows*/ 2) {
-				attr(textarea, "rows", /*rows*/ ctx[1]);
+			if (dirty & /*placeholder*/ 1) {
+				attr(textarea, "placeholder", /*placeholder*/ ctx[0]);
 			}
 
-			if (dirty & /*placeholder*/ 4) {
-				attr(textarea, "placeholder", /*placeholder*/ ctx[2]);
+			if (dirty & /*style*/ 8) {
+				attr(textarea, "style", /*style*/ ctx[3]);
+			}
+
+			if (dirty & /*styleVariables*/ 4) {
+				attr(div, "style", /*styleVariables*/ ctx[2]);
 			}
 		},
 		i: noop,
@@ -6299,11 +6304,17 @@ function create_fragment$h(ctx) {
 }
 
 function instance$h($$self, $$props, $$invalidate) {
+	let style;
+	let styleVariables;
 	let $value;
 	let { name = '' } = $$props;
+	let { placeholder = '回答を入力してください' } = $$props;
 	let { required = true } = $$props;
-	let { rows = 2 } = $$props;
-	let { placeholder = '' } = $$props;
+	let { _style = '' } = $$props;
+	let { _focusStyle = 'border-width: 2px; border-color: #2aab9f; border-style: solid' } = $$props;
+	let { font = SYSTEM_FONT } = $$props;
+	let { _textStyle = '' } = $$props;
+	let { _placeholderStyle = 'color: #ccc;' } = $$props;
 	const { path: statePath } = getStateItemContext();
 
 	const value = registerInput({
@@ -6315,7 +6326,7 @@ function instance$h($$self, $$props, $$invalidate) {
 		}
 	});
 
-	component_subscribe($$self, value, value => $$invalidate(3, $value = value));
+	component_subscribe($$self, value, value => $$invalidate(4, $value = value));
 
 	function handleInput(event) {
 		const updated = event.target.value;
@@ -6323,13 +6334,54 @@ function instance$h($$self, $$props, $$invalidate) {
 	}
 
 	$$self.$$set = $$props => {
-		if ('name' in $$props) $$invalidate(6, name = $$props.name);
-		if ('required' in $$props) $$invalidate(0, required = $$props.required);
-		if ('rows' in $$props) $$invalidate(1, rows = $$props.rows);
-		if ('placeholder' in $$props) $$invalidate(2, placeholder = $$props.placeholder);
+		if ('name' in $$props) $$invalidate(7, name = $$props.name);
+		if ('placeholder' in $$props) $$invalidate(0, placeholder = $$props.placeholder);
+		if ('required' in $$props) $$invalidate(1, required = $$props.required);
+		if ('_style' in $$props) $$invalidate(8, _style = $$props._style);
+		if ('_focusStyle' in $$props) $$invalidate(9, _focusStyle = $$props._focusStyle);
+		if ('font' in $$props) $$invalidate(10, font = $$props.font);
+		if ('_textStyle' in $$props) $$invalidate(11, _textStyle = $$props._textStyle);
+		if ('_placeholderStyle' in $$props) $$invalidate(12, _placeholderStyle = $$props._placeholderStyle);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*font*/ 1024) {
+			addFont(font);
+		}
+
+		if ($$self.$$.dirty & /*_style, _textStyle, font*/ 3328) {
+			$$invalidate(3, style = [..._style.split(';'), ..._textStyle.split(';'), `font-family:${font}`].join(';'));
+		}
+
+		if ($$self.$$.dirty & /*_focusStyle, _placeholderStyle*/ 4608) {
+			$$invalidate(2, styleVariables = (() => {
+				const variables = {};
+				const focusStyleObj = parseStyle(_focusStyle);
+				const placeholderStyle = parseStyle(_placeholderStyle);
+				if (focusStyleObj['border-width']) variables['--focus-border-width'] = focusStyleObj['border-width'];
+				if (focusStyleObj['border-color']) variables['--focus-border-color'] = focusStyleObj['border-color'];
+				if (focusStyleObj['border-style']) variables['--focus-border-style'] = focusStyleObj['border-style'];
+				if (placeholderStyle.color) variables['--placeholder-color'] = placeholderStyle.color;
+				return stringifyStyleObj(variables);
+			})());
+		}
 	};
 
-	return [required, rows, placeholder, $value, value, handleInput, name];
+	return [
+		placeholder,
+		required,
+		styleVariables,
+		style,
+		$value,
+		value,
+		handleInput,
+		name,
+		_style,
+		_focusStyle,
+		font,
+		_textStyle,
+		_placeholderStyle
+	];
 }
 
 class FormTextarea extends SvelteComponent {
@@ -6343,10 +6395,14 @@ class FormTextarea extends SvelteComponent {
 			create_fragment$h,
 			safe_not_equal,
 			{
-				name: 6,
-				required: 0,
-				rows: 1,
-				placeholder: 2
+				name: 7,
+				placeholder: 0,
+				required: 1,
+				_style: 8,
+				_focusStyle: 9,
+				font: 10,
+				_textStyle: 11,
+				_placeholderStyle: 12
 			},
 			add_css$g
 		);
@@ -6361,12 +6417,12 @@ function add_css$f(target) {
 
 function get_each_context$5(ctx, list, i) {
 	const child_ctx = ctx.slice();
-	child_ctx[16] = list[i];
-	child_ctx[18] = i;
+	child_ctx[17] = list[i];
+	child_ctx[19] = i;
 	return child_ctx;
 }
 
-// (98:2) {#each _options as option, i}
+// (99:2) {#each _options as option, i}
 function create_each_block$5(ctx) {
 	let label;
 	let input;
@@ -6374,8 +6430,9 @@ function create_each_block$5(ctx) {
 	let input_checked_value;
 	let t0;
 	let span;
-	let t1_value = /*option*/ ctx[16] + "";
+	let t1_value = /*option*/ ctx[17] + "";
 	let t1;
+	let span_style_value;
 	let t2;
 	let mounted;
 	let dispose;
@@ -6392,10 +6449,10 @@ function create_each_block$5(ctx) {
 			attr(input, "class", "radio-button-input svelte-17s08g");
 			attr(input, "style", /*buttonStyle*/ ctx[5]);
 			attr(input, "name", /*name*/ ctx[0]);
-			input.value = input_value_value = /*option*/ ctx[16];
-			input.checked = input_checked_value = /*option*/ ctx[16] === /*_value*/ ctx[3];
+			input.value = input_value_value = /*option*/ ctx[17];
+			input.checked = input_checked_value = /*option*/ ctx[17] === /*_value*/ ctx[3];
 			attr(span, "class", "radio-button-text svelte-17s08g");
-			attr(span, "style", /*_textStyle*/ ctx[2]);
+			attr(span, "style", span_style_value = `${/*_textStyle*/ ctx[2]} ${/*fontCss*/ ctx[6]}`);
 			attr(label, "class", "radio-button svelte-17s08g");
 		},
 		m(target, anchor) {
@@ -6407,7 +6464,7 @@ function create_each_block$5(ctx) {
 			append(label, t2);
 
 			if (!mounted) {
-				dispose = listen(input, "change", /*handleChange*/ ctx[7](/*i*/ ctx[18]));
+				dispose = listen(input, "change", /*handleChange*/ ctx[8](/*i*/ ctx[19]));
 				mounted = true;
 			}
 		},
@@ -6422,18 +6479,18 @@ function create_each_block$5(ctx) {
 				attr(input, "name", /*name*/ ctx[0]);
 			}
 
-			if (dirty & /*_options*/ 16 && input_value_value !== (input_value_value = /*option*/ ctx[16])) {
+			if (dirty & /*_options*/ 16 && input_value_value !== (input_value_value = /*option*/ ctx[17])) {
 				input.value = input_value_value;
 			}
 
-			if (dirty & /*_options, _value*/ 24 && input_checked_value !== (input_checked_value = /*option*/ ctx[16] === /*_value*/ ctx[3])) {
+			if (dirty & /*_options, _value*/ 24 && input_checked_value !== (input_checked_value = /*option*/ ctx[17] === /*_value*/ ctx[3])) {
 				input.checked = input_checked_value;
 			}
 
-			if (dirty & /*_options*/ 16 && t1_value !== (t1_value = /*option*/ ctx[16] + "")) set_data(t1, t1_value);
+			if (dirty & /*_options*/ 16 && t1_value !== (t1_value = /*option*/ ctx[17] + "")) set_data(t1, t1_value);
 
-			if (dirty & /*_textStyle*/ 4) {
-				attr(span, "style", /*_textStyle*/ ctx[2]);
+			if (dirty & /*_textStyle*/ 4 && span_style_value !== (span_style_value = `${/*_textStyle*/ ctx[2]} ${/*fontCss*/ ctx[6]}`)) {
+				attr(span, "style", span_style_value);
 			}
 		},
 		d(detaching) {
@@ -6472,7 +6529,7 @@ function create_fragment$g(ctx) {
 			}
 		},
 		p(ctx, [dirty]) {
-			if (dirty & /*_textStyle, _options, buttonStyle, name, _value, handleChange*/ 189) {
+			if (dirty & /*_textStyle, fontCss, _options, buttonStyle, name, _value, handleChange*/ 381) {
 				each_value = /*_options*/ ctx[4];
 				let i;
 
@@ -6518,6 +6575,7 @@ function instance$g($$self, $$props, $$invalidate) {
 	let { required = false } = $$props;
 	let { _layoutStyle = 'flex-direction: column; gap: 0px;' } = $$props;
 	let { font = SYSTEM_FONT } = $$props;
+	const fontCss = font ? 'font-family:' + font : '';
 	let { _textStyle = 'color: #333; font-size: 12px; line-height:1.5;' } = $$props;
 	let { buttonSize = '16px' } = $$props;
 	let { buttonColor = { main: '#f0f1f1', sub: '#f0f1f1' } } = $$props;
@@ -6534,7 +6592,7 @@ function instance$g($$self, $$props, $$invalidate) {
 		}
 	});
 
-	component_subscribe($$self, value, value => $$invalidate(14, $value = value));
+	component_subscribe($$self, value, value => $$invalidate(15, $value = value));
 
 	const handleChange = index => event => {
 		if (event.target.checked) {
@@ -6544,26 +6602,26 @@ function instance$g($$self, $$props, $$invalidate) {
 
 	$$self.$$set = $$props => {
 		if ('name' in $$props) $$invalidate(0, name = $$props.name);
-		if ('options' in $$props) $$invalidate(8, options = $$props.options);
-		if ('required' in $$props) $$invalidate(9, required = $$props.required);
+		if ('options' in $$props) $$invalidate(9, options = $$props.options);
+		if ('required' in $$props) $$invalidate(10, required = $$props.required);
 		if ('_layoutStyle' in $$props) $$invalidate(1, _layoutStyle = $$props._layoutStyle);
-		if ('font' in $$props) $$invalidate(10, font = $$props.font);
+		if ('font' in $$props) $$invalidate(11, font = $$props.font);
 		if ('_textStyle' in $$props) $$invalidate(2, _textStyle = $$props._textStyle);
-		if ('buttonSize' in $$props) $$invalidate(11, buttonSize = $$props.buttonSize);
-		if ('buttonColor' in $$props) $$invalidate(12, buttonColor = $$props.buttonColor);
-		if ('buttonColorActive' in $$props) $$invalidate(13, buttonColorActive = $$props.buttonColorActive);
+		if ('buttonSize' in $$props) $$invalidate(12, buttonSize = $$props.buttonSize);
+		if ('buttonColor' in $$props) $$invalidate(13, buttonColor = $$props.buttonColor);
+		if ('buttonColorActive' in $$props) $$invalidate(14, buttonColorActive = $$props.buttonColorActive);
 	};
 
 	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*font*/ 1024) {
+		if ($$self.$$.dirty & /*font*/ 2048) {
 			addFont(font);
 		}
 
-		if ($$self.$$.dirty & /*options*/ 256) {
+		if ($$self.$$.dirty & /*options*/ 512) {
 			$$invalidate(4, _options = options.split(','));
 		}
 
-		if ($$self.$$.dirty & /*buttonColor, buttonColorActive, buttonSize*/ 14336) {
+		if ($$self.$$.dirty & /*buttonColor, buttonColorActive, buttonSize*/ 28672) {
 			$$invalidate(5, buttonStyle = (() => {
 				return stringifyStyleObj({
 					'--color-main': buttonColor.main,
@@ -6575,7 +6633,7 @@ function instance$g($$self, $$props, $$invalidate) {
 			})());
 		}
 
-		if ($$self.$$.dirty & /*$value*/ 16384) {
+		if ($$self.$$.dirty & /*$value*/ 32768) {
 			$$invalidate(3, _value = $value[0]);
 		}
 	};
@@ -6587,6 +6645,7 @@ function instance$g($$self, $$props, $$invalidate) {
 		_value,
 		_options,
 		buttonStyle,
+		fontCss,
 		value,
 		handleChange,
 		options,
@@ -6611,14 +6670,14 @@ class FormRadioButtons extends SvelteComponent {
 			safe_not_equal,
 			{
 				name: 0,
-				options: 8,
-				required: 9,
+				options: 9,
+				required: 10,
 				_layoutStyle: 1,
-				font: 10,
+				font: 11,
 				_textStyle: 2,
-				buttonSize: 11,
-				buttonColor: 12,
-				buttonColorActive: 13
+				buttonSize: 12,
+				buttonColor: 13,
+				buttonColorActive: 14
 			},
 			add_css$f
 		);
@@ -6638,7 +6697,7 @@ function get_each_context$4(ctx, list, i) {
 	return child_ctx;
 }
 
-// (108:10) {:else}
+// (107:10) {:else}
 function create_else_block(ctx) {
 	let t;
 
@@ -6658,7 +6717,7 @@ function create_else_block(ctx) {
 	};
 }
 
-// (106:10) {#if option}
+// (105:10) {#if option}
 function create_if_block$2(ctx) {
 	let t_value = /*option*/ ctx[19] + "";
 	let t;
@@ -6679,7 +6738,7 @@ function create_if_block$2(ctx) {
 	};
 }
 
-// (104:6) {#each _options as option, i}
+// (103:6) {#each _options as option, i}
 function create_each_block$4(ctx) {
 	let option;
 	let t;
@@ -6890,11 +6949,12 @@ function instance$f($$self, $$props, $$invalidate) {
 			$$invalidate(1, _value = $value[0]);
 		}
 
-		if ($$self.$$.dirty & /*_style, _textStyle, _value, _placeholderStyle*/ 25602) {
+		if ($$self.$$.dirty & /*_style, _textStyle, _value, _placeholderStyle, font*/ 29698) {
 			$$invalidate(3, style = [
 				..._style.split(';'),
 				..._textStyle.split(';'),
-				...!_value ? _placeholderStyle.split(';') : []
+				...!_value ? _placeholderStyle.split(';') : [],
+				`font-family:${font}`
 			].join(';'));
 		}
 
@@ -6902,11 +6962,10 @@ function instance$f($$self, $$props, $$invalidate) {
 			$$invalidate(2, styleVariables = (() => {
 				const variables = {};
 				const focusStyleObj = parseStyle(_focusStyle);
-				const placeholderStyle = parseStyle(_placeholderStyle);
+				parseStyle(_placeholderStyle);
 				if (focusStyleObj['border-width']) variables['--focus-border-width'] = focusStyleObj['border-width'];
 				if (focusStyleObj['border-color']) variables['--focus-border-color'] = focusStyleObj['border-color'];
 				if (focusStyleObj['border-style']) variables['--focus-border-style'] = focusStyleObj['border-style'];
-				if (placeholderStyle.color) variables['--placeholder-color'] = placeholderStyle.color;
 				variables['--icon-color'] = iconColor;
 				variables['--icon-size'] = iconSize;
 				return stringifyStyleObj(variables);
@@ -7409,9 +7468,11 @@ function instance$d($$self, $$props, $$invalidate) {
 	};
 
 	function getTextButtonStyle(isActive) {
-		return isActive
-		? [...buttonStyle.split(';'), ...buttonActiveStyle.split(';')].join(';')
-		: buttonStyle;
+		return [
+			...buttonStyle.split(';'),
+			`font-family:${font}`,
+			...isActive ? buttonActiveStyle : []
+		].join(';');
 	}
 
 	$$self.$$set = $$props => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plaidev/karte-action-sdk",
-  "version": "1.1.206-28200003.1303b11e",
+  "version": "1.1.206-28204054.f9403484",
   "author": "Plaid Inc.",
   "license": "Apache-2.0",
   "module": "./dist/index.es.js",