import { Version } from '@microsoft/sp-core-library' ; import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base' ; import { IPropertyPaneConfiguration , PropertyPaneTextField } from '@microsoft/sp-property-pane' ; import { escape } from '@microsoft/sp-lodash-subset' ; import styles from './HelloWorldWebPart.module.scss' ; import * as strings from 'HelloWorldWebPartStrings' ; export interface IHelloWorldWebPartProps { description : string ; } export default class HelloWorldWebPart extends BaseClientSideWebPart < IHelloWorldWebPartProps > { public render ( ) { this . domElement . innerHTML = `
      <div class="${ styles . helloWorld }">
        <div class="${ styles . container }">
          <div class="${ styles . row }">
            <div class="${ styles . column }">
              <span class="${ styles . title }">Welcome to SharePoint!</span>
              <p class="${ styles . subTitle }">Customize SharePoint experiences using Web Parts.</p>
              <p class="${ styles . description }">${ escape ( this . properties . description ) }</p>
              <a href="https://aka.ms/spfx" class="${ styles . button }">
                <span class="${ styles . label }">Learn more</span>
              </a>
            </div>
          </div>
        </div>
      </div>` ; } protected get dataVersion ( ) : Version { return Version . parse ( '1.0' ) ; } protected getPropertyPaneConfiguration ( ) { return { pages : [ { header : { description : strings . PropertyPaneDescription } , groups : [ { groupName : strings . BasicGroupName , groupFields : [ PropertyPaneTextField ( 'description' , { label : strings . DescriptionFieldLabel } ) ] } ] } ] } ; } }