@functionalcms/svelte-components 4.10.46 → 4.10.48

package/dist/components/form/Form.svelte

@@ -6,6 +6,7 @@
 	import Switch from './Switch.svelte';
 	import { Placement } from '../Styling.js';
 	import Button from './Button.svelte';
+	import { superForm } from 'sveltekit-superforms';
 
 	interface FormButton {
 		label: string;
@@ -17,6 +18,7 @@
 		buttons: Array<FormButton>;
 		action: string;
 		schema: Array<Field>;
+		superform: Record<string, unknown>;
 		buttonPosition: Placement;
 		buttonsContainer: string;
 	}
@@ -24,10 +26,13 @@
 	let {
 		buttons = [],
 		schema = [],
+		superform = {},
 		action = '',
 		buttonsContainer = '',
 		buttonPosition = Placement.Bottom
 	}: Partial<Props> = $props();
+
+	const { form, enhance } = superForm(superform);
 </script>
 
 {#snippet renderButtons()}
@@ -38,7 +43,7 @@
 	</div>
 {/snippet}
 
-<form method="POST" {action}>
+<form method="POST" {action} use:enhance>
 	<fieldset>
 		{#if buttonPosition === Placement.Top}
 			{@render renderButtons()}
@@ -47,14 +52,19 @@
 		<div>
 			{#each schema as field}
 				{#if field.type === 'boolean'}
-					<Switch name={field.name} id={field.name} label={field.name} />
+					<Switch
+						name={field.name}
+						id={field.name}
+						label={field.name}
+						isChecked={$form[field.name]}
+					/>
 				{:else if field.type === 'enum' && field.meta.type === 'select'}
 					<Select
 						name={field.name}
 						id={field.name}
 						label={field.name}
 						options={mapEntiresToOptions(field)}
-						singleSelected="LOW"
+						singleSelected={$form[field.name]}
 					/>
 				{:else if field.type === 'enum'}
 					<ChoiceInput
@@ -73,6 +83,7 @@
 						label={field.name}
 						type={field.meta.type}
 						isRequired={field.isRequired}
+						bind:value={$form[field.name]}
 					/>
 				{/if}
 			{/each}

package/dist/components/form/Form.svelte.d.ts

@@ -8,6 +8,7 @@ declare const Form: import("svelte").Component<Partial<{
     }>;
     action: string;
     schema: Array<Field>;
+    superform: Record<string, unknown>;
     buttonPosition: Placement;
     buttonsContainer: string;
 }>, {}, "">;

package/dist/components/form/Input.svelte

@@ -60,7 +60,7 @@
 		isUnderlined = false,
 		labelSize = '',
 		type = 'text',
-		value = '',
+		value = $bindable(''),
 		placeholder= '',
 		...restProps
 	}: Partial<Props> = $props();

package/dist/components/form/Input.svelte.d.ts

@@ -25,6 +25,6 @@ declare const Input: import("svelte").Component<Partial<{
     value: string | any;
     addonLeft: Snippet;
     addonRight: Snippet;
-}>, {}, "">;
+}>, {}, "value">;
 type Input = ReturnType<typeof Input>;
 export default Input;

package/dist/components/form/form.d.ts

@@ -7,6 +7,7 @@ export interface Field {
 }
 export declare function serialize(schema: any): Promise<Field[]>;
 export declare function createForm(schema: any): Promise<import("sveltekit-superforms").SuperValidated<{}, any, {}>>;
+export declare function readForm(formRequest: any, schema: any): Promise<import("sveltekit-superforms").SuperValidated<{}, any, {}>>;
 export declare function mapEntiresToOptions(field: Field): {
     label: string;
     value: string;

package/dist/components/form/form.js

@@ -21,6 +21,10 @@ export async function createForm(schema) {
     const form = await superValidate(yup(schema), {});
     return form;
 }
+export async function readForm(formRequest, schema) {
+    const form = await superValidate(formRequest, yup(schema));
+    return form;
+}
 export function mapEntiresToOptions(field) {
     return (field?.entries?.map((entry) => ({
         label: entry,

package/dist/index.d.ts

@@ -34,7 +34,7 @@ export { default as AntiBot } from './components/form/AntiBot.svelte';
 export { default as Dropzone } from './components/form/Dropzone.svelte';
 export { default as Select } from './components/form/Select.svelte';
 export { default as Form } from './components/form/Form.svelte';
-export { type Field, serialize, createForm, mapEntiresToOptions } from './components/form/form.js';
+export { type Field, serialize, createForm, readForm, mapEntiresToOptions } from './components/form/form.js';
 export { default as Markdown } from './components/content/Markdown.svelte';
 export { type BlogPost, listAllPosts, importPost } from './components/blog/blog.js';
 export { default as EasyTools } from './components/integrations/EasyTools.svelte';

package/dist/index.js

@@ -46,7 +46,7 @@ export { default as AntiBot } from './components/form/AntiBot.svelte';
 export { default as Dropzone } from './components/form/Dropzone.svelte';
 export { default as Select } from './components/form/Select.svelte';
 export { default as Form } from './components/form/Form.svelte';
-export { serialize, createForm, mapEntiresToOptions } from './components/form/form.js';
+export { serialize, createForm, readForm, mapEntiresToOptions } from './components/form/form.js';
 /*
  * Content
  */

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@functionalcms/svelte-components",
-	"version": "4.10.46",
+	"version": "4.10.48",
 	"watch": {
 		"build": {
 			"patterns": [