How to pass spawned machine refs to @xstate/react's useActor?

[cmh-echomark]

I've been following the spawn docs here with the @xstate/react useActor docs and I noticed a lot of "Coming soon" placeholder text. Is this not supported?

I have several nested/child machines in my xstate v4 that use the old spawn method along with useActor.

Sample code

Here is a codesandbox example here that I cannot get to function.

Parent machine:

export const TEST_MACHINE_ID = "test-machine-id";

export const testMachine = setup({
  types: {
    context: {} as {
      guid: string;
      childMachineRef: ActorRefFrom<typeof childMachine>;
    },
    events: {} as { type: "START" } | { type: "BACK_TO_IDLE" },
    input: {} as { guid: string },
  },
}).createMachine({
  id: TEST_MACHINE_ID,
  context: ({ input }) => {
    return {
      guid: undefined,
      ...input,
    };
  },
  
  initial: "idle",
  states: {
    idle: {
      on: {
        START: { target: "deferToChild" },
      },
    },
    deferToChild: {
       entry: [
         assign({
            childMachineRef: ({ spawn }) =>
            spawn(childMachine, { id: "what-does-this-do" }),
         }),
    ],
      on: { BACK_TO_IDLE: { target: "idle" } },
    },
  },
});

Child machine

import { sendParent, setup } from "xstate";

export const CHILD_MACHINE_ID = "child-machine-id";

export const childMachine = setup({
  types: {
    context: {} as {
      guid: string;
    },
    input: {} as { guid: string },
  },
}).createMachine({
  id: CHILD_MACHINE_ID,
  context: ({ input }) => ({
    ...input,
  }),
  initial: "childishness",
  states: {
    childishness: {
      on: {
        RETURN_TO_PARENT: {
          actions: sendParent({ type: "BACK_TO_IDLE" }),
        },
      },
    },
  },
});

Parent React component

const initialGuid = crypto.randomUUID();

export default function App() {
  const [snapshot, send] = useMachine(testMachine, {
    input: { guid: initialGuid },
  });

  const content = (() => {
    if (snapshot.matches("idle")) {
      return (
        <>
          {snapshot.context.guid}
          <button
            onClick={() => {
              send({ type: "START" });
            }}
          >
            Spawn child
          </button>
        </>
      );
    }
    if (snapshot.matches("deferToChild")) {
      return <ChildContent actor={snapshot.context.childMachineRef} />;
    }
  })();

  return <>{content}</>;
}

Child React component

const childGuid = crypto.randomUUID();

export const ChildContent = ({
  actor,
}: {
  actor: ActorLogicFrom<typeof childMachine>;
}) => {
  const [snapshot, send] = useActor(actor, {
    input: { guid: childGuid },
  });

  return (
    <pre>
      {JSON.stringify(snapshot, undefined, 2)}
      <button
        onClick={() => {
          send({ type: "RETURN_TO_PARENT" });
        }}
      >
        click
      </button>
    </pre>
  );
};

Am I doing it wrong? Or is this not yet supported in xstate v5?

I have tried combinations of useActorRef, useMachine, useSelector - all have limitations and/or cannot communicate between child/parent as I expect (based on what was available in v4).