After a very successful version 3.0 in June 2023, we are excited to announce the general availability of the Microsoft Graph Toolkit v4.0.

This release is packed with new capabilities, improvements to the developer experience and bug fixes that will be appreciated by end-users. Starting with v4.0 of Microsoft Graph Toolkit, users will be able to edit To Do items directly using the components, see colleagues’ presence and cards when selecting them via our people picker. We also promoted our search components to their general availability and are now fully supported. For developers, this release greatly improves the developer experience. Our investments were mainly in 2 areas: performance and convenience.

We introduced Microsoft Graph Toolkit in September 2019, and since then, we’ve seen incredible adoption and an amazing response from the developer community and our partners. Our team has been hard at work taking the feedback and requests we’ve received and turning them into the exciting new features we’re excited to share with you today.

If you are new to the Microsoft Graph Toolkit, it is a collection of reusable, framework-agnostic components, and authentication providers for accessing and working with Microsoft Graph. The components are fully functional, customizable, and work with any web framework and on all modern browsers. You can learn more by reading our documentation or by trying one of our getting started guides.

What’s new in v4.0?

New scenarios: update your To Do items directly within the Toolkit

Some feedback we were getting with the Toolkit was that it was providing great productivity enhancements in LOB and ISV apps, but that some of our components were missing key scenarios. To overcome the most requested missing scenario, we added the ability to edit To Do items directly in the component. This enables users to take quick action on their tasks and ensure they are up to date.

More context provided with our people picker

Selecting people is critical in productivity scenarios. Whether it is to assign a task to someone or to start a conversation with a group of people, we believe picking people in a rich way is important for end users. To provide more context to this component, we have added the presence of users as part of the control and the ability to see the person’s card of every selected individual.

Build a search-driven application

After 6 months of preview, we believe our search components have enough power to provide rich search-driven applications. We have promoted them to GA components to help developers build rich search centers and users to easily find what they are looking for.

Developer experience

Improved performance

In this version of Microsoft Graph Toolkit, we wanted to focus on performance and drive down the size of the resulting bundles that include our components.

First, we updated our underlying framework (Lit) to take advantage of asynchronous rendering. This allows our components to be a lot more aware of their state and re-render less often, leaving more memory and cycles for the rest of the page.

Second, we drastically improved the size of the consumers’ bundles by moving to an explicit registration of the components that are used. With this approach, only the used components are bundled, leaving behind everything that is not necessary. While this has an impact on the developer experience, we believe it will provide a much better user experience.

Provide more productivity for developers

As part of this release, we enhanced numerous aspects of the developer experience to make them more productive and focus on the problems they are trying to solve.

• We converted all our attributes to leverage string unions instead of Enums. This allows for simpler code and better documentation, especially when using the Toolkit with React
• We removed the need for our specific SPFx package. This simplifies the experience for all SharePoint developers and is more performant.
• We removed the mgt-loader to simplify the onboarding experience and to offer a single way to consume the Toolkit thanks to all major browsers supporting ESM modules.
• For developers using our playground, we enabled a log-in experience where it is now possible to test and experience the toolkit with your own data.

Bug fixes and improvements

This update also includes bug fixes and improvements that aren’t specifically highlighted in this post. To see the full list, check out our release notes.

Updating your applications

To update your application to use the newest version of Microsoft Graph Toolkit, navigate to your project directory and run:

npm i @microsoft/mgt

This update includes breaking changes that may impact your application. Please go to our upgrade guide to see a detailed list of the changes.

Try it now!

We can’t wait for you to try Microsoft Graph Toolkit v4.0. We’re looking forward to hearing from you about these improvements and how we can continue to make the Microsoft Graph Toolkit even better.

Visit the Microsoft Graph Dev Center for more resources.

Follow us on X (Twitter) / @Microsoft365Dev and subscribe to our YouTube channel to stay up to date on the latest developer news and announcements.