Use useEffect instead of useLayoutEffect

The former would "block the browser from painting", which is unnecessary for these hooks.

More info: https://react.dev/reference/react/useLayoutEffect#examples

packages/@react-facet/core/src/hooks/useFacetCallback.ts

@@ -1,4 +1,4 @@
-import { useCallback, useLayoutEffect, useRef } from 'react'
+import { useCallback, useEffect, useRef } from 'react'
 import { Facet, NO_VALUE, ExtractFacetValues, NoValue } from '../types'
 
 /**
@@ -43,7 +43,7 @@ export function useFacetCallback<M, Y extends Facet<unknown>[], T extends [...Y]
   facets: T,
   defaultReturnValue?: M,
 ): (...args: K) => M | NoValue {
-  useLayoutEffect(() => {
+  useEffect(() => {
     // Make sure to start subscriptions, even though we are getting the values directly from them
     // We read the values using `.get` to make sure they are always up-to-date
     const unsubscribes = facets.map((facet) => facet.observe(() => {}))

packages/@react-facet/core/src/hooks/useFacetUnwrap.ts

@@ -1,4 +1,4 @@
-import { useLayoutEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { FacetProp, isFacet, Value, NoValue, EqualityCheck, NO_VALUE } from '../types'
 import { defaultEqualityCheck } from '../equalityChecks'
 
@@ -20,7 +20,7 @@ export function useFacetUnwrap<T extends Value>(
     }
   })
 
-  useLayoutEffect(() => {
+  useEffect(() => {
     if (!isFacet(prop)) return
 
     // Initialize the equalityCheck

packages/@react-facet/dom-components/src/useSetProp.ts

@@ -1,10 +1,10 @@
-import { useLayoutEffect } from 'react'
+import { useEffect } from 'react'
 import { FacetProp, isFacet } from '@react-facet/core'
 
 type Scalar = string | number | boolean | undefined
 
 export function useSetProp<T extends Scalar>(prop: FacetProp<T> | undefined, update: (value: T | undefined) => void) {
-  useLayoutEffect(() => {
+  useEffect(() => {
     if (isFacet(prop)) {
       return prop.observe(update)
     } else {