styles

The styles is a writable store that contains the custom classnames that you set for the form or globally.

Example

Set styles

<script lang="ts">
  import { faviform, setConfig } from '@tuentyfaiv/svelte-form';
  import type { ContextStyles } from '@tuentyfaiv/svelte-form';

  const styles: ContextStyles = {
    // ...classnames
  };

  const form = faviform<Data>({ styles });
  // or globally
  setConfig(styles);
</script>

Use styles

// Custom component
<script lang="ts">
  import { useForm } from '@tuentyfaiv/svelte-form';

  const form = faviform<Data>();
  const { styles } = form;
</script>

<label class={$styles.container}>
  <span class={$styles.label}>
  <input class={$styles.input} />
</label>