Custom Control in a standard grid - reactjs

Question

I need to add a react custom control in a grid column. Can I do it without make a custom grid from scratch?
What I'm thinking about is something like this ReactPeoplePicker, but added to an existing grid.

Answer 1

Three weeks later I can answer myself: yes, I can. This is what I did:
Create a PCF with Powerapps CLI (I choose dataset template) and installs dependencies:
npm install
npm install react #types/react react-dom #types/react-dom #fluentui/react
Create a peoplepicker.tsx and copy-paste react component code from https://developer.microsoft.com/es-ES/fluentui#/controls/web/peoplepicker.
In index.ts file I import react, react-dom and component:
import * as ReactDOM from 'react-dom';
import * as React from 'react';
import { picker } from './components/peoplepicker'
Define and initialize context and container variables:
export class PeoplePicker implements ComponentFramework.StandardControl<IInputs, IOutputs> {
private context:ComponentFramework.Context<IInputs>;
private container:HTMLDivElement;
/**
* Empty constructor.
*/
constructor() { }
public init(context: ComponentFramework.Context<IInputs>, notifyOutputChanged: () => void, state: ComponentFramework.Dictionary, container: HTMLDivElement)
{
// Add control initialization code
this.context = context;
this.container = container;
Render the react component and append to container:
public updateView(context: ComponentFramework.Context<IInputs>): void
{
ReactDOM.render(
React.createElement(PeoplePicker),
this.container);
Build solution and import to Power Apps portal:
npm run build
pac pcf push --publisher-prefix myPrefix
Finally, in Power Apps Portal, navigate to grid (or subgrid) properties and add a custom control. Keep in mind may be classic mode will be required.