fix(react): useObservablesProxy calls setState during a render

react/headless/src/utils/stores.ts

@@ -39,6 +39,7 @@ export function useObservablesProxy<State>(stores: {[K in keyof State & string a
 	const internalState = useMemo(() => {
 		const internalState = {
 			hasEffect: false,
+			notified: true,
 			storeInfo: {} as Record<string, {unsubscribe: null | (() => void)}>,
 			checkStoreSubscribed: (key: string) => {
 				const store = (stores as any)[`${key}$`];
@@ -49,9 +50,15 @@ export function useObservablesProxy<State>(stores: {[K in keyof State & string a
 						internalState.storeInfo[key] = storeInfo;
 					}
 					if (internalState.hasEffect && !storeInfo.unsubscribe) {
-						storeInfo.unsubscribe = store.subscribe(() => {
-							triggerRerender({});
+						let sync = true;
+						storeInfo.unsubscribe = store.subscribe(async () => {
+							if (!sync && !internalState.notified) {
+								internalState.notified = true;
+								await Promise.resolve();
+								triggerRerender({});
+							}
 						});
+						sync = false;
 					}
 				}
 				return store;
@@ -68,6 +75,7 @@ export function useObservablesProxy<State>(stores: {[K in keyof State & string a
 		};
 		return internalState;
 	}, []);
+	internalState.notified = false;
 	useEffect(() => {
 		internalState.hasEffect = true;
 		for (const key of Object.keys(internalState.storeInfo)) {