Forum Discussion

Copper Contributor

Nov 28, 2016

How to implement a full-page property pane in SPFX webpart

Hi, I am trying to create an SPFX webpart to allow users to edit list items in multiple lists across multiple sites. To do this I need a lot of configuration info (i.e. users need to select the list...

John_Sanders

Microsoft

Nov 30, 2016

Currently the property pane is a fixed size for our initial implementation. In the future we have discussed allowing this pane to resize, but haven't yet implemented that...

We understand that you may need to make content that is wider, available for your web parts, so you can build your own panel. For your scenario, I'd use the office ui fabric panel size = large http://dev.office.com/fabric#/components/panel#Overview

The fabric-react code visualized on dev.office.com/fabric is a bit behind the github repository https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/office-ui-fabric-react

Hope that helps.

russell gove
Copper Contributor
Dec 05, 2016
Thanks John , I'm not sure what you mean by 'Build your own panel?
Is there a way to have spfx load a custom panel when I click the prncil? Or are you just saying Build the editing of properties directly in the UI of my App?
If I build th eUI in my APP What Api would I use to update the properties of the webpart. If I just set the 'Properties' Property of the BaseClientSideWebpartm will it be automatically persisted?
- Russell Gove
  Iron Contributor
  Feb 26, 2017
  thanks john, that helped,me out.
  in case it helps anyone else, an example of full page property panes can be found in the react-multilist-grid sample app at https://github.com/SharePoint/sp-dev-fx-webparts/tree/master/samples/react-multilist-grid