Microsoft recently released version 1.18 of SharePoint Framework with several updates, focused on Viva Connections' components feature updates but also bringing updates for some long-standing dependencies.
On September 12th, 2023, Microsoft released the new SharePoint Framework (SPFx) 1.18 version, five months after the last minor version 1.17. It is worth noticing that the previous version already saw four patch updates: 1.17.1 to 1.17.4, covering specific errors in library packaging. Patch updates are rarely released for SharePoint Framework, but since version 1.17 Microsoft announced that they were going to release smaller patches more frequently.
Version 1.18 of SPFx is mainly focused on feature updates for Microsoft Viva Connections components. The Viva Connections’ components in SPFx are delivered in the form of Adaptive Card Extensions (ACEs), UI components that leverage Microsoft's own adaptive cards' visual language. While adaptive cards are broader in scope and present in several Microsoft products such as Outlook, Teams or SharePoint, adaptive card extensions are a component of Viva Connections.
When support for ACEs was introduced in SharePoint Framework 1.13, the adaptive card extension visualisation in the UI, called card view in SPFx, was restricted. Developers could choose between three fixed templates: BaseBasicCardView, BaseImageCardView and BasePrimaryTextCardView.
In version 1.18, the view for a custom ACE extends a new base class called BaseComponentsCardView. This class requires developers to override the cardViewParameters getter property to provide the specific components for the card view, namely the card image, the card bar, the header, the body and the footer. To simplify the code and to help with the codebase migration, the old base classes are now available as helpers called BasicCardView, ImageCardView and PrimaryTextCardView. There is a tutorial in the SPFx documentation about migrating the custom ACEs from earlier SPFx versions to version 1.18 and a new UI guidance on how to design useful adaptive cards.
Earlier ACE components allowed only the interaction of clicking a button on the card. In version 1.18, the ACE components can contain a text input control, which is not yet fully supported on the mobile Viva Connections app. The text input control raises an onChange event which can be intercepted and acted upon.
There is a specific search card template for those ACEs which leverage search capabilities. The search card has a search box, which acts as a text input control mentioned above. The updated documentation contains a tutorial on how to build a people search solution with ACEs.
Another improvement in the interactivity of custom ACEs is the support for Adaptive Cards Execute action. This action allows the developers to send a collection of all the card properties and input values to a specified API endpoint.
Besides all the feature updates for Viva Connections adaptive card extensions, version 1.18 updates some of the base dependency libraries for SPFx developers. Until now, SPFx didn’t support Node 18, leaving developers in need of managing multiple Node versions, as one user on X (formerly Twitter) mentions. SPFx version 1.18 supports Node 18, TypeScript 4.7 and Microsoft’s Fluent UI React library v8. The full release notes of the changes in version 1.18 are available on the GitHub release page.
SharePoint Framework (or SPFx) is the set of tools and libraries to build extensibility options in Microsoft 365. With SharePoint Framework developers can create solutions for Microsoft SharePoint, Microsoft Teams and Microsoft Viva products. The SPFx uses industry-standard tooling such as Yeoman, TypeScript, Lint, WebPack and other client-side libraries. The issues list is hosted on GitHub and currently has 578 open issues.