diff --git a/packages/svelteui-core/src/components/Accordion/Accordion.stories.svelte b/packages/svelteui-core/src/components/Accordion/Accordion.stories.svelte
index 050829c6..832b33af 100644
--- a/packages/svelteui-core/src/components/Accordion/Accordion.stories.svelte
+++ b/packages/svelteui-core/src/components/Accordion/Accordion.stories.svelte
@@ -75,7 +75,14 @@
 </Story>
 
 <Story name="Controlled" id="accordionControlledStory">
-	<Accordion {value} on:change={(e) => (value = e.detail)}>
+	<button
+		on:click={() => {
+			const array = ['typescript', 'packed', 'accessible'];
+			value = array[Math.floor(Math.random() * array.length)];
+		}}>Pick random</button
+	>
+	{value}
+	<Accordion {value}>
 		<Accordion.Item value="typescript">
 			<div slot="control">Typescript Based</div>
 			Build type safe applications. All SvelteUI packages are built with TypeScript and support it by
diff --git a/packages/svelteui-core/src/components/Accordion/Accordion.svelte b/packages/svelteui-core/src/components/Accordion/Accordion.svelte
index c9b25748..9a760dc2 100644
--- a/packages/svelteui-core/src/components/Accordion/Accordion.svelte
+++ b/packages/svelteui-core/src/components/Accordion/Accordion.svelte
@@ -40,7 +40,7 @@
 
 	const dispatch = createEventDispatcher();
 
-	let _value: AccordionValue<Multiple> = value || defaultValue;
+	let _value: AccordionValue<Multiple>;
 	let stateContent = {
 		variant,
 		order,
@@ -56,6 +56,7 @@
 	const state = writable(stateContent);
 
 	// converts internal value into correct type
+	$: _value = value || defaultValue;
 	$: {
 		if (multiple && !Array.isArray(_value)) {
 			_value = (_value ? [_value] : []) as AccordionValue<Multiple>;