Using map components - how to set spatialReferenceLocked on view

[AJasper]

I'm using arcgis/map-components in my app and I'm having a bit of a problem setting the spatialReferenceLocked of the map view. See code below (TypeScript/Angular).

    const sr = new SpatialReference({
      wkid: 27700,
    });

    this.arcgisMap = this.mapViewElement?.nativeElement as ArcgisMap;

    let baseLayer: Layer;

    if (environment.baseLayerType === 'VectorTileLayer') {
      baseLayer = new VectorTileLayer({
        url: environment.baseMapUrl,
        title: 'Great Britain',
      });
    } else {
      baseLayer = new TileLayer({
        url: environment.baseMapUrl,
        title: 'Great Britain',
      });
    }

    const extent = new Extent({
      xmin: -100000,
      ymin: -30000,
      xmax: 710000,
      ymax: 1250000,
      spatialReference: sr.clone(),
    });

    const map = new Map({
      basemap: new Basemap({
        baseLayers: [baseLayer],
        spatialReference: sr.clone(),
      }),
    });

    this.arcgisMap.extent = extent;
    this.arcgisMap.constraints.maxScale = 0;
    this.arcgisMap.constraints.lods = TileInfo.create({
      spatialReference: extent.spatialReference.clone(),
    }).lods;
    this.arcgisMap.view.spatialReferenceLocked = true;

    this.arcgisMap.map = map;

 On line 41 where the spatialReferenceLocked property is being set to true (filters out basemaps as using basemap gallery) it errors with the error 

[esri.core.Accessor] cannot assign to construct-only property 'spatialReferenceLocked'

I cannot figure out how I set this property, any help would be greatly appreaciated.

Thanks,

Adam