Programmatic control

If you need to control the form programmatically, you can bind to the form property.

<script lang="ts">
  import type { Schema } from "@sjsf/form";

  import CustomForm from "@/components/custom-form.svelte";

  const schema: Schema = {
    type: "string",
  };

  let form = $state<HTMLFormElement>();
</script>

<CustomForm bind:form {schema} novalidate onSubmit={(v) => window.alert(v)}>
  {null}
</CustomForm>

<button
  onclick={() => {
    form?.requestSubmit();
  }}>My submit</button
>

<button onclick={() => {
  form?.reset();
}} >
  My reset
</button>

Methods

Also you can bind to this to get access to exported methods:

Validate

Perform validation on the form without form state modifications.

import type { Errors } from '@sjsf/form';

function validate(): Errors<E>