WebPart Configuration

1 minute read

This component is used with the WebPart component. This component renders a button to the page, displaying a configuration panel displaying the webpart’s custom properties. This component can be extended for further customizations.

Available Components

  • WebPartCfgPanel
    • The base component rendering a button and panel
  • WebPartListCfg
    • Allows the user to specify the target web and list
    • Inherits from the WebPartCfgPanel component
  • WebPartFieldCfg
    • Allows the user to specify a list of fields from the selected list
    • Inherits from the WebPartListCfg component
  • WebPartSearchCfg
    • Filters the list of fields to specific types allowed for the search webpart
    • Inherits from the WebPartFieldCfg component

Additional Information

Reference this blog post for additional details of developing modern webparts in SharePoint 2013.


IWebPartCfg (WebPart Configuration)

  • WebPartId:string
    • The webpart id containing the element

IWebPartCfgProps (WebPart Configuration Properties)

  • cfg:IWebPartCfg
    • The webpart configuration
  • cfgElementId:string
    • The target element id to render the component to

IWebPartCfgState (WebPart Configuration State)

  • cfg:IWebPartCfg
    • The webpart configuration

IWebPartCfgPanel (WebPart Configuration Panel)

  • _errorMessage:HTMLDivElement
    • A reference to the error message element.
  • _panel:Panel
    • A reference to the configuration panel element.
  • onRenderContents:(cfg:IWebPartCfg) => JSX.Element Array
    • The render contents event.
  • onRenderFooter:() => JSX.Element | Array
    • The render footer event.
  • onRenderHeader:() => JSX.Element | Array
    • The render header event.
  • saveConfiguration:(wpCfg:IWebPartCfg) => void
    • Method to save the webpart configuration.
    • This method will cause a postback, since it updates the webpart content.