SPFX-COMMAND-EXTENSION

Save and convert as PDF by PnP

Save and convert as PDF by PnP

A global list customizer which adds functionality to all document libraries in SharePoint Online to convert one or more documents in-place to PDF, or download one or more documents as a PDF. When selecting multiple documents for download they will be downloaded as a zip file. The converter uses built in API’s of converting to PDF.

Open this sample in the gallery (popup panel): Open in gallery

Print List Item Command View Set

Print List Item Command View Set

This sample shows how you can print list items using different templates, site admin can add, edit or remove templates and users can print items based on those templates.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-print

configure a Page as Single App Part page

configure a Page as Single App Part page

Custom Command Set that set a Page layout to use the Single App Part page Layout

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-singlepartapppage

React-Manage-List-Subscriptions

React-Manage-List-Subscriptions

Demonstrates managing the list subscriptions (sharepoint webhooks) and action to renew the webhook expiration date using Rest calls.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-manage-list-subscriptions

Modern Page Model with PnP/PnPjs

Modern Page Model with PnP/PnPjs

A SPFx extension using @pnp/sp that allow creating Modern Pages based on prefilled modern pages marked as “Page Model”, inside the Site Pages Library, and code defined pages. Users can select a Modern page as Model just setting a custom property page named “Is Model” to “Yes”. People often need to create periodically editorial pages with the same composition, sections structure and webpart configuration, in order to give users the same users experience between pages with different contents but with the same communicative purpose

Change Page Layout Command Extension

Change Page Layout Command Extension

Listview command extension that is available only for the Site Pages library to change the layout type. If the page is Article, it can be changed to Home which will remove the page title placeholder and vice versa.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-change-page-layouttype

Share to Teams

Share to Teams

Share to teams helps us to share files along with folders in document library it also alows us to share pages in the site pages library and last but not the least it allows sharing list items to teams channels or group.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/js-share-to-teams

Send-To-Teams - Command Set

Send-To-Teams - Command Set

This Command Set allows to create an adaptive card based on list data and send to microsoft teams chanel, The user can select the list fields that will show on the card.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-send-to-teams

Jump to folder extension

Jump to folder extension

Sample solution that facilitates navigation between large collections of SharePoint library folders.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-jump-to-folder

Demote News to Page

Demote News to Page

Sample SharePoint Framework list view command set extension to demote a previously promoted News page.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-demote-news

File Size Viewer sample with Command View Set

File Size Viewer sample with Command View Set

This sample shows how to create Command View Set working with single and multiple files selection. Once selected some files, it will show file sizes representation using a React D3 TreeMap component. This sample also shows how to integrate D3.js third party components within SharePoint Framework.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-file-size-viewer

Add Folders Command

Add Folders Command

Sample SharePoint Framework list view command set extension to create folders that can be all at the current location (parallel) or nested (one after another).

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-addfolders

Copy Classic Link Extension

Copy Classic Link Extension

Sample SharePoint Framework list view command set extension that copies the classic link (path) of a selected item. Uses copy-to-clipboard library, toastr and sweet alert for notifications.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/js-command-copy-classic-link

Image Editor Command Set

Image Editor Command Set

This command set allows quick edit images located in Document Library.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-image-editor

Folder Selection

Folder Selection

This extension creates a callout with a dropdown that allows users to select from a list of top level folders in a document library. After selecting the folder they can use the button to navigate to that folder.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-folder-select

Get Thumbnail List Item Command View Set

Get Thumbnail List Item Command View Set

This Command Set uses Microsoft Graph API to get the Thumbnail URL, of selected size (small, medium, large), for any file stored in a SharePoint Document Library.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-get-thumbnail

Image Metadata from Cognitive Services Vision API List View Command Set

Image Metadata from Cognitive Services Vision API List View Command Set

Custom Command Set that gets metadata information from MS Cognitive Services Vision API for the selected Image

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-vision-api

Generate QR Code List Item Command View Set

Generate QR Code List Item Command View Set

Generates a printable QR code which links to a SharePoint list item.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-qrcode

Custom Dialog Sample with Command View Set

Custom Dialog Sample with Command View Set

This sample shows how to create Custom Dialogs using @microsoft/sp-dialog package in the context of Command View Set. You can use also custom dialogs with client-side web parts or with any SharePoint Framework component types.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-dialog

Form Settings Command View Set

Form Settings Command View Set

This sample shows how you can redirect default SharePoint list forms (New,Edit,Display) to different pages.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-form-settings

Clone ListView Command Set

Clone ListView Command Set

Sample SharePoint Framework listview command set extension that allows users to clone one or more list items. Demonstrates conditional visibility, PnPJS requests, PnPJS Batching, and field specific formats for rest operations.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/js-command-clone

Send Document With E-Mail

Send Document With E-Mail

This sample shows how to create Custom Dialogs using @microsoft/sp-dialog package in the context of Command View Set and send selected document with e-mail.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-send-document

Get a direct link to a document or folder

Get a direct link to a document or folder

Sample SharePoint Framework (SPFx) solution which gives the end-user the ability to just get a regular, simple link to a document or folder in the modern SharePoint document libraries. This is done using a CommandSet.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-direct-link

Mail Current View as Image

Mail Current View as Image

Sample SharePoint Framework list view command set extension that emails the current view to selected (external or internal user) and also saves the same image in SharePoint. Uses html2canvas library, pnp spfx controls, pnp js and office fabric ui react.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-mail-view-as-image

Convert documents to PDF using Azure function

Convert documents to PDF using Azure function

Sample SPFx list view command set extension that converts the selected documents to PDF using Microsoft Graph.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/js-command-convert-to-pdf

Multishare Command Extension with PnPJs

Multishare Command Extension with PnPJs

The sample is an custom action only active when multiple items are selected.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-share-pnpjs

Discuss Now Command Set

Discuss Now Command Set

Sample SharePoint Framework command set showing how to create a new meeting to discuss about a document selected in the current list view of a document library.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-discuss-now

Item History

Item History

This listview command is used to show the past versions of the selected list item in a grid.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-item-History

Export Selected Items to Excel

Export Selected Items to Excel

Exports selected items to excel spreadsheet in xlsx format, with the columns from the current modern list view.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/js-command-selecteditems-export

Lock Item Command Set Customizer

Lock Item Command Set Customizer

The sample illustrates the ability to lock/unlock selected item/document for the current user. The lock is implemented as item’s unique permissions set to Full Control for current user only. The lock is available only for items that inherit permissions from the parent. Items with unique permissions can’t be locked as we can’t unlock them correctly later on. All other permissions are deleted. The Command is available only for users who have “Manage Permissions” permissions for the list/document library.

Unique Item Permissions Command Set Customizer

Unique Item Permissions Command Set Customizer

The sample illustrates creation of a shortcut command to redirect user to selected item’s permission page.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/js-command-item-permissions

Custom Command Bar Command Set Customizer

Custom Command Bar Command Set Customizer

The sample illustrates how to display custom Command Bar when Command Set Button is pressed.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-custom-command-bar

Directions SharePoint Framework list view command set

Directions SharePoint Framework list view command set

Sample SharePoint Framework list view command set showing travel directions to the given location using Google Maps.

Open this sample in the gallery (popup panel): Open in gallery

Source: https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-directions