[Form] Workaround Svelte 5 dispatching change event immediately

techniq · Jul 31, 2024 · f419435 · f419435
1 parent f20cb28
commit f419435
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/.changeset/rare-beers-juggle.md b/.changeset/rare-beers-juggle.md
@@ -0,0 +1,5 @@
+---
+'svelte-ux': patch
+---
+
+[Form] Workaround Svelte 5 dispatching `change` event immediately
diff --git a/packages/svelte-ux/src/lib/components/Form.svelte b/packages/svelte-ux/src/lib/components/Form.svelte
@@ -5,6 +5,7 @@
   import formStore from '../stores/formStore.js';
   import { getComponentClasses } from './theme.js';
   import { cls } from '../utils/styles.js';
+  import changeStore from '../stores/changeStore.js';
 
   const dispatch = createEventDispatcher();
 
@@ -18,7 +19,8 @@
   const [_state, draft, errors] = formStore(initial, { schema });
   $: current = draft.current;
 
-  $: dispatch('change', $_state);
+  const changed = changeStore(_state, (value) => dispatch('change', value.current));
+  $changed; // must subscribe to store to get onChange callbacks
 </script>
 
 <form