Hi everyone - I am trying to extend Pega's UI by including a custom ReactJS control: ag-Grid. However, when including my control in a section & running said section, I get the following (JavaScript) error message:

ReferenceError: AgGridReact is not defined

Here's what I did:

1.) Created a new Text File rule, react_aggrid (JS), pasting this code there.

2.) Created another Text File, react_aggrid_ctl (JSX), with the following content:

class AgGrid extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      columnDefs: [
        { headerName: "Make", field: "make" },
        { headerName: "Model", field: "model" },
        { headerName: "Price", field: "price" }],
      rowData: [
        { make: "Toyota", model: "Celica", price: 35000 },
        { make: "Ford", model: "Mondeo", price: 32000 },
        { make: "Porsche", model: "Boxter", price: 72000 }]
    }
  }

  render() {
    return (
      <div className="ag-theme-balham" style={ {height: '200px', width: '600px'} }>
        <AgGridReact
            columnDefs={this.state.columnDefs}
            rowData={this.state.rowData}>
        </AgGridReact>
      </div>

    );
  }
}

3.) Created a new Control rule, with the following HTML:

<!-- use the bundle 'pzpega_ui_react_dev' for development and 'pzpega_ui_react' for production -->
<pega:onlyonce name="pega_ui_react">
<pega:static type="script" app="webwb">
  <pega:bundle name="pzpega_ui_react" />
</pega:static>
</pega:onlyonce>

<!-- only include this component once per page -->
<pega:onlyonce name="react_aggrid">
<pega:static type="script" app="webwb">
   <pega:file name="react_aggrid.js"/>
   <pega:file name="react_aggrid_ctl.js"/>
</pega:static>
</pega:onlyonce> 

<div id="root"></div>

<script>
let myGrid = React.createElement(AgGrid);
ReactDOM.render(myGrid, document.getElementById('root'));
/*
ReactDOM.render(
  React.createElement(
    AgGrid, 
    {'param1': 'value' }), 
    document.getElementById("myGrid"));
*/
</script>

However, it seems to me that Pega doesn't import ag-Grid, or the JavaScript equivalent of:

import { AgGridReact } from 'ag-grid-react';

Any thoughts?