import * as React from 'react' ; import * as ReactDom from 'react-dom' ; import { Version } from '@microsoft/sp-core-library' ; import { IPropertyPaneConfiguration , PropertyPaneTextField } from '@microsoft/sp-property-pane' ; import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base' ; import * as strings from 'SpfxAzureTranslatorWebPartStrings' ; import SpfxAzureTranslator from './components/SpfxAzureTranslator' ; import { ISpfxAzureTranslatorProps } from './components/ISpfxAzureTranslatorProps' ; export interface ISpfxAzureTranslatorWebPartProps { AzureSubscriptionKey : string ; ServiceName : string ; } export default class SpfxAzureTranslatorWebPart extends BaseClientSideWebPart < ISpfxAzureTranslatorWebPartProps > { public render ( ) { const element = React . createElement ( SpfxAzureTranslator , { AzureSubscriptionKey : this . properties . AzureSubscriptionKey , ServiceName : this . properties . ServiceName } ) ; ReactDom . render ( element , this . domElement ) ; } protected onDispose ( ) { ReactDom . unmountComponentAtNode ( this . domElement ) ; } protected get dataVersion ( ) : Version { return Version . parse ( '1.0' ) ; } protected getPropertyPaneConfiguration ( ) { return { pages : [ { header : { description : strings . PropertyPaneDescription } , groups : [ { groupName : strings . BasicGroupName , groupFields : [ PropertyPaneTextField ( 'AzureSubscriptionKey' , { label : "Azure Subscription Key" } ) , PropertyPaneTextField ( 'ServiceName' , { label : "Service Name" } ) ] } ] } ] } ; } }