Help requested on wrapping react component into angular

[epetxepe]

Hi all,

I'm trying to learn how to use the angular-react through the examples in the wiki. Not sure if this is the correct place to ask, please tell me otherwise.

• I've successfully achieved the use of already provided fab elements (fab-calendar, fab-dialog or fab-primary-button) and setting their properties successfully

• I've successfully created a React JS library (packed and deployed) and used in React Applications

import React, { Component } from 'react'
import PropTypes from 'prop-types'

import styles from './styles.css'

export default class ExampleComponent extends Component {
constructor(props) {
super(props);
}

static propTypes = {
name: PropTypes.string
}

render() {

return (
  <div className={styles.test}>
    Hello {this.props.name} {this.props.lastname}
  </div>
)

}
}

• But I'm stuck on creating the wrapper library as described in Authoring wiki page

Module specification is quite straightforward, but I'm stuck with component definition. I've tried looking at how it was made for Fabric e.g. Dialog => React and Component Wrapper but these are bit complex to follow.

One of the requirements of ReactWrapperComponent is to place a <TProps extends {}> which for Fabric element is made through Typescript Interface definitions e.g. export class FabDialogComponent extends ReactWrapperComponent, but as I'm using React in JS and not Typescript, It's not clear to me, what to put in ReactWrapperComponent<> and how to access my react Props (i.e. name & lastname).

• Is it necessary to work with React Typescript or is it possible to wrap libraries in React JS?
• What is the goal of renderCount && onRenderCount in the Authoring wiki?
• Following Fabric Component Wrapper example I miss (onIncrement)="onIncrementHandler($event)" or similar in the template, am I missing something?
• Could you provide or is it accessible the 'my-react-ui-library' used in Authoring wiki?
• Could somebody provide a corresponding wrapper code for the simple example (ExampleComponent) provided above?

Thanks in advance and sorry for the dumminess,

Gorka