Setting Values dies when specified via a prop

[TruePath]

When I try to update the value of a form from an object passed in props I get a bunch of warnings saying: "Since strict-mode is enabled, changing (observed) observable values without using an action is not allowed. Tried to modify: Field@18.$value "

and then an error saying "Maximum update depth exceeded."

Specifically my code looks like this (some details removed for clarity)

import React from 'react';
import ReactDOM from "react-dom"
import { observer } from "mobx-react-lite"
import validatorjs from 'validatorjs';
import MobxReactForm from 'mobx-react-form';

    const fields = [{
      name: 'email',
      label: 'Email',
      placeholder: 'Email',
      rules: 'required|email|string|between:5,25',
      // value: user.email,
    }, … 
    ]

const FormModel = new MobxReactForm({ fields }, { plugins, hooks }); //nothing exception here standard plugins/hooks

const UserForm = observer(({open, onClose, object}) => {  //My component…object has fields with names email…

  FormModel.$("email").set(object.email); //This works fine if I replace object.email with "foo" 

  return (<MobxInput field={FormModel.$("email")} fullWidth />);
});

export default UserForm;

Yes, I've checked the object has the appropriate fields (it's just a bare object passed in from parent …not even an observable object in this case).

I fear maybe I misunderstand how this is supposed to work but I also tried to simply build FormModel inside my component, i.e., move it and fields down inside the function, and specify values inside field there but then I can't type into any of the resulting forms (I presume because mobx gets confused when the observed object is created inside the observer).

Is this an error or am I just confused?

[TruePath]

Doh I'm an idiot