Customize Fields with SharePoint Framework

SharePoint Framework Field Customizer extension can be used to customize the behavior of a specified column on the list or library. The customization can be visual, such as an animated indicator of a missing value, a visual bar graph of progress, or functional (like a slider for changing the column value).

Creating a new Field Customizer starts again with yo @microsoft/sharepoint on the newly created project folder. The type of the client-side component is Extension and the type of the client-side extension is Field Customizer, and for the next example, React is chosen as the JavaScript framework.

The example is a simple toggle, which can be used to visualize and control Yes/No typed list columns. The example is utilizing Office UI Fabric for rendering the toggle. For accessing and updating the column values, PnPjs libraries are used to simplify the utilization of SharePoint REST APIs. PnPjs is a community-driven initiative, which develops...