v4.0.0

4.0.0 (2024-02-05)

⚠ BREAKING CHANGES

• mgt-loader.js is removed and there is no support for es5 only browsers direct from CDN. Developers loading mgt from a CDN must use module syntax and explicitly initialize their applications.
• mgt-spfx is deprecated, use disambiguation instead
• ViewType is now a string union type and not an enum
• UserType is now a string union type and not an enum
• PersonType is now a string union type and not an enum
• GroupType is now a string union type and not an enum
• groupType property on MgtPeoplePicker is now a GroupType[] not a GroupType that is a bitmask of the desired group types. Developers using the group-type attribute will find the behavior unchanged.
• the avatarType eunm has been renamed to AvatarType for consistency and converted to a string union type
• the ResponseType for mgt-get is now a string union type and not an enum
• PersonCardInteraction is now a string union type and not an enum
• convert attribute enums to string unions (#2962)
• PersonViewType has been removed. 'avatar' is no longer a valid value for the 'view' attribute on the 'mgt-person' component
• permissions: applications using mgt-person with fetch-image and person-detal where the supplied value is a group will now need to consent to either Group.Read.All or Group.ReadWrite.All. This replaces the existing behavior where the group image would silently fail to load and show an http 403 error in the console.
• permissions: minimal permission for planner calls changed from Group.ReadWrite.All to Tasks.ReadWrite for write operation and from Group.Read.All to Tasks.Read for read operations.
• prepScopes now accepts an array of scopes, this is checked against the set of currently consented scopes for the user. If any of the supplied scopes are found, then no additional scopes are requested. If no match is found, then the user will be prompted to consent to the first scope in the supplied array of scopes
• mgt-tasks has been removed and replaced with mgt-planner. mgt-planner does not support data-source switching to fetch data from the outlook tasks apis any longer.
• Developers must explicitly call the register function for all web components used in their application when using components from @microsoft/mgt-components. Importing from the root of @microsoft/mgt-components no longer has an automatic registration side effect. NOTE Components from @microsoft/mgt-react will automatically register the underlying web component when they are used for the first time.
• MgtPersonCard no longer has a static config property.This config has been moved to the MgtPersonCardConfig class to allow developers to import the config and associated getMgtPersonCardScopes function at the top level of their applicaiton without automatically adding the weight of the full mgt-person-card component and dependencies to the entry file for their applications.
• default behavior of mgt-people-picker changes so presence is not shown unless show-presence attribute or showPresence property are set
• applications importing @microsoft/mgt-react but not using the wrapper components will not have components automatically registered in the browser. This leads to a breaking change when these applications emit raw web component markup rather than using the wrapper components.

Features

• add edit funtionality to mgt-todo (#2783) (64acd1f)
• add ElectronContextBridgeProvider (#2914) (8900eb4)
• add optional person-card to people picker (#2900) (65ca8e2)
• add show-presence to mgt-people-picker (#2812) (f5bf7cc)
• add support for nested values in mgt-picker key-name (#2917) (e79fbdc)
• automatically convert disambiguation value to lowercase (#2898) (992ab85)
• convert attribute enums to string unions (#2962) (18d0aec)
• deprecate mgt-spfx package (#2940) (3da9560)
• enable live code inclusion for consuming applications (#2642) (c41d719)
• enable user sign-in for storybook (#2851) (335c2f3)
• promoting search components to GA (#2909) (86697f4)
• remove mgt-loader (#2963) (ea0f71b)
• rename mgt-tasks to mgt-planner (#2890) (df8af8c)
• require explicit component registration (#2848) (b7db262)
• scope aware requests (#2797) (81d124b)
• split config and permission methods out of mgt-person-card (#2840) (8177699)
• use @lit/task to schedule async data fetching (#2912) (14a96ff)

Bug Fixes

• add connect img and frame csp directives (#2910) (20eb7fc)
• add detail-line part attribute to person component (#2999) (b254e49)
• add focus on input field when you click the button to add a new task (#2994) (573fa45)
• add method to clear selected channel in mgt-teams-channel-picker (#2865) (c3a3d82)
• adding headers and count on all potential advanced aad queries (#2920) (90b2dd1)
• clean-up react-contoso homepage (#3008) (c8c564d)
• color inversion on suggestion list (65ca8e2)
• consolidate person view types (#2943) (6d44a17)
• correct completion of todo items (#3018) (52d8ad9)
• correct filter concatenation in mgt-people-picker (#2822) ([18925a9](https://github...

v3.1.3

3.1.3 (2023-10-06)

Bug Fixes

• a11y: mgt-file and mgt-picker visibility issues in dark-mode (#2667) (239bfb0)
• add Group entity to IDynamicPerson type and introduce typeguards to find the entity type (#2688) (b3bc50d)
• add spaces to presence hover text in mgt-person (#2693) (f50e6ab)
• disable todo checkboxes and inputs in read-only mode (#2745) (d19f078)
• ensure batch url resources start with / (#2740) (247f37a)
• ensure msal public client application is initialized (#2702) (b9fcfe7)
• ensure people-picker search works when userIds are supplied(#2736) (a724b05)
• initials rendering in mgt-person (#2764) (882aaf6)
• MgtProfile: Fix handling of null values for educations & work positions (#2717) (ba381c8)
• typing for template props data context (#2754) (c9023c2)
• update mgt-taxonomy-picker colors to match mgt-picker (#2747) (be7add8)

v3.1.2

3.1.2 (2023-09-05)

We're excited to announce our v3.1.2 release of the Microsoft Graph Toolkit 🦒 with 4 bug fixes.

🧑‍💻 Updating your application

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

npm i @microsoft/mgt@latest

If you’re using the Toolkit via mgt-loader and update your script tag to:

<script src="https://unpkg.com/@microsoft/mgt@3/dist/bundle/mgt-loader.js"></script>

🐞 Bug Fixes

• adds pointer cursor to logged in accounts (#2674) (11e5a1c)
• disable open on click behavior (#2685) (10b25f9)
• set custom css token --default-font-family to apply to all elements in DOM (#2677) (cb69e01)
• use correct scope for group member resolution (#2690) (ca313c1)

🎉 Celebrating our contributors

• @gavinbarron
• @Mnickii

📃Changelog

Full Changelog: v3.1.1...v3.1.2

v3.1.1

3.1.1 (2023-08-17)

We're excited to announce our v3.1.1 release of the Microsoft Graph Toolkit 🦒 with 2 bug fixes.

🧑‍💻 Updating your application

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

npm i @microsoft/mgt@latest

If you’re using the Toolkit via mgt-loader and update your script tag to:

<script src="https://unpkg.com/@microsoft/mgt@3/dist/bundle/mgt-loader.js"></script>

🐞 Bug Fixes

• dismiss login flyout when moving out of the popup (#2637) (263f36f)
• use pointer cursor when person card enabled in mgt-person. (#2652) (48ea18b)

🎉 Celebrating our contributors

• @agaskelluk made their first contribution in #2652
• @Mnickii

📃Changelog

Full Changelog: v3.1.0...v3.1.1

v3.1.0

3.1.0 (2023-07-28)

We're excited to announce our v3.1.0 release of the Microsoft Graph Toolkit 🦒!

🧑‍💻 Updating your application

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

npm i @microsoft/mgt@latest

If you’re using the Toolkit via mgt-loader and update your script tag to:

<script src="https://unpkg.com/@microsoft/mgt@3/dist/bundle/mgt-loader.js"></script>

🎨 Features

• add canary url to allowed endpoints for graph (#2635) (ec621cd)

🐞 Bug Fixes

• a11y: add distinct name definitions for copy code buttons in storybook overview (#2622) (4e52f41)
• add a title text if displaying images only. (#2625) (28703c9)
• check the file type being uploaded before performing upload (#2584) (7fb265c)
• remove agenda tooltip (#2621) (27e1fc9)

📃Changelog

Full Changelog: v3.0.1...v3.1.0

v3.0.1

3.0.1 (2023-07-18)

We're excited to announce our v3.0.1 release of the Microsoft Graph Toolkit 🦒!

🧑‍💻 Updating your application

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

npm i @microsoft/mgt@latest

If you’re using the Toolkit via mgt-loader and update your script tag to:

<script src="https://unpkg.com/@microsoft/mgt@3/dist/bundle/mgt-loader.js"></script>

🐞 Bug Fixes

• a11y: unset custom color of storybook left chevrons (#2595) (764bf12)
• add InAConferenceCall activity when availability is Busy (#2585) (bd17195)
• add class to people-picker styles story to enable custom css (#2605) (dcec953)
• add font family to tasks (#2603) (e380b4a)
• add login custom styles, removes style not in use (#2587) (7ba98e4)
• adds customHosts support for non-graph domain requests (#2592) (1f97215)
• announce teams channel results when you type (#2561) (5260ce0)
• aspnet proxy provider sample (#2594) (362339a)
• correct sppkg upload script (#2552) (8b20d84)
• files compact view in person card (#2597) (6985717)
• people picker default selections (#2579) (49b81bf)
• use iterator to load events from event-query (#2600) (0ba37cc)

🎉 Celebrating our contributors

• @techienickb made their first contribution in #2592
• @gavinbarron
• @Mnickii
• @musale

📃Changelog

Full Changelog: v3.0.0...v3.0.1

v3.0.0

We're excited to announce our Release v3.0.0 of the Microsoft Graph Toolkit 🦒🎉! In this release, we have a large number of fixes, new features, accessibility improvements and general new enhancements. The full list is below! But in short, we'd love to highlight key capabilities:

🎉 Highlights

MGT.v3.0.-.Feature.Video.mp4

Infrastructure updates

We updated the Microsoft Graph JavaScript SDK to the version 3 to benefit from all the latest capabilities including support for large files uploads and better error handling. While making this change, we also enabled leveraging the Toolkit in sovereign clouds.

Major styling updates

We enhanced the styling of all our components to meet our accessibility standards and to fully embrace Fluent 2 and its implementation in web components. Your applications will feel a lot more connected to the rest of Microsoft 365 by having the familiar look and feel, simplifying the adoption and usage of your apps for your users! We also updated our dark and light themes to feel closer to Microsoft 365 experiences.

Improved the SharePoint Framework development experience

In the past, if you wanted to build SharePoint Framework (SPFx) apps, you had to deploy a common library component providing a single instance of the Toolkit for all web parts in the tenant. This was cumbersome, easily missed and did not provide great experience for applications acquired through the store. Thanks to our disambiguation features, we now allow developers to define prefixes to their components to avoid any naming collisions in shared environments like SharePoint pages. Disambiguation is intended to provide developers with a mechanism to use a specific version of the Toolkit in their solution without encountering collisions with other solutions that may be using the Toolkit.

New scenarios

Select an item from a collection of entities

As part of v3.0, we are adding a new mgt-picker component, allowing generic selection of Microsoft Graph entities from collections. It’s intended to be used to select an item from a list of items, for example a task list from the user’s task lists, a user from its direct reports, a list from a site, etc.

Easily switch between light and dark mode

To simplify switching from one theme to the next, we are introducing a mgt-theme-toggle component. This component can be used to change the theme experience from light to dark mode (and vice versa). You can also use our internal utilities to invoke the same using your custom code.

Select a term from Microsoft Graph taxonomy

We are adding a new mgt-taxonomy-picker component, allowing selection of Microsoft Graph taxonomy entities. Built on top of our mgt-picker component, it’s intended to be used to select a term from a term set. We want to share our gratitude to the contributor of this new component, Anoop Tatti, for this highly requested component!

Build a search-driven application

As requested by our community, we wanted to provide a new capability that allows developers to build solutions leveraging the Microsoft Graph search APIs. Up until now, it was not possible to use any of our components, including the mgt-get component to achieve this scenario. Starting with this release, we are excited to add 2 new components helping you to build search scenarios: mgt-search-box and mgt-search-results! These components, when used together, can offer a perfect foundation for a search-driven application.

Improved scenarios

Seamlessly switch between accounts

We heard from a lot of our partners and customers that offering a mechanism to allow multiple users connected to be able to switch to a different user account was key to a great experience. We’re bringing multi-account support to our mgt-login component in this version!

Send messages while staying in-context

We had a basic messaging feature in our mgt-person-card and wanted to bring a fully featured message box that allows users to send quick messages to others while staying in the flow of their work. We are introducing this new quick chat message in this preview version.

Updating your application

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

npm i @microsoft/mgt

If you’re using the Toolkit via mgt-loader and update your script tag to:

<script src="https://unpkg.com/@microsoft/mgt@3/dist/bundle/mgt-loader.js"></script>

This update includes breaking changes that may impact your application, such as deprecation of properties, use of the embedded Microsoft Graph client and naming updates to CSS custom properties. Please refer to our upgrade guide to see a detailed list of the changes.

🎨What's Changed

• Updated Graph Client to v3 by @nmetulev in #1040
• [person]: Update person component to latest Fluent UI design by @Mnickii in #1773
• chore: update fluent with main by @Mnickii in #1804
• feature: update File component to latest Fluent design by @Mnickii in #1802
• feature: Update Person Card to latest Fluent UI by @Mnickii in #1797
• feat: update mgt-login to new fluent-ui designs by @gavinbarron in #1807
• feature: Update the people component to Fluent UI by @musale in #1786
• feature: Update people-picker component to fluentui design by @musale in #1801
• chore: update to lit 2.0 by @gavinbarron in #1810
• fix: lock responselike resolutions to v2.0.0 by @Mnickii in #1851
• feat: no-framework spfx webpart by @gavinbarron in #1863
• fix: People picker RTL renders, focus and storybook loading errors by @musale in #1864
• Next/node16 support by @gavinbarron in #1911
• fix: restore provided msal public client behavior by @gavinbarron in #1931
• feat: add support for GCC and other sovereign clouds by @musale in #1928
• chore: upgrade sample to angular 14 by @gavinbarron in #1968
• docs: update README to remove 404s by @sebastienlevert in #1990
• feat: add custom element disambiguation by @gavinbarron in #1852
• docs: adds version information to storybook by @gavinbarron in #1999
• Removed the selected-item template by @sebastienlevert in #2004
• feat: add tests and example jest config by @gavinbarron in #1987
• bug: fix html title for mgt.dev by @gavinbarron in #2019
• chore: send notification to teamsfx when new version released by @SLdragon in #1994
• feat: add spfx utils for disambiguation by @gavinbarron in #1914
• fix: fix dynamic group id people picker story by @gavinbarron in #2023
• feat: typed events by @gavinbarron in #1981
• Update TeamsFxProvider.ts for Graph Toolkit 3.0 by @SLdragon in #1983
• feature: update File List component to Fluent UI by @Mnickii in #1833
• bug: people picker state management by @gavinbarron in #2028
• Fix: PeoplePicker add removePerson safety input check by @masashiswingle in #2033
• fix: correct typing problems in sample vue app by @gavinbarron in https://gi...

v2.11.2

We're excited to announce our v2.11.1 release of the Microsoft Graph Toolkit 🦒! In this patch release, we did 1 fix to solve issues with loading data for file lists.

Updating your application

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

npm i @microsoft/mgt@latest

If you’re using the Toolkit via mgt-loader, your application will be automatically updated to the newest version.

🐞 Fixes

• Add top to the file-list cache key signature by @musale in #2406

Full Changelog: v2.11.0...v2.11.2

v3.0.0-rc.3

We're excited to announce our Release Candidate for v3.0.0 of the Microsoft Graph Toolkit 🦒, v3.0.0-rc.3! Why rc.3 in the version number? Because @gavinbarron forgot about how versioning of SharePoint framework solutions works and took a couple of attempts to get a release with a package for mgt-spfx to be included 😒. In this release, we have a number of fixes, accessibility improvements and new enhancements.

Updating your application

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

npm i @microsoft/[email protected]

If you’re using the Toolkit via mgt-loader and update your script tag to:

<script src="https://unpkg.com/@microsoft/[email protected]/dist/bundle/mgt-loader.js"></script>

🎨 Enhancements:

• Removed the Teams, TeamsMsal2 and the Msal providers in v3.x.x by @musale in #2231
• Added mgt-taxonomy-picker control by @anoopt in #2172
• Added mgt-picker selected-value attribute by @gavinbarron in #2363
• Added preview component support by @gavinbarron in #2356
• Added design token overrides to theme switching by @gavinbarron in #2328

🐞 Bugs fixed:

• Removed theme-toggle capability from custom CSS property and templating stories by @musale in #2326
• Include mgt-mock-provider as dependency to mgt by @gavinbarron in #2336
• Fixes person component responsive issue by @Mnickii in #2297
• Fixes person text visibility in custom properties by @Mnickii in #2298
• Adds title tag in location icon svg by @musale in #2285
• Open file/folder in new window when you press enter/space on it by @musale in #2325
• Fixes keyboard navigation of login account list by @gavinbarron in #2289
• Make tasks header navigable with the keyboard. by @musale in #2313
• Sethe teams-channel-picker dropdown to overlay all other elements by @musale in #2337
• Fixes storybook footer accessibility by @gavinbarron in #2369
• Fixes new task select rendering by @gavinbarron in #2368
• Fixes override design token logic by @gavinbarron in #2384
• Fixes running beta queries and eliminate re-renders in mgt-search-results by @sebastienlevert in #2391
• Makes editor tabs in playground keyboard navigable by @gavinbarron in #2371
• Sets react peer dependency as range by @gavinbarron in #2393
• Adds aria-label text to announce cancelling adding a new task by @musale in #2359

📃Changelog

Full Changelog: v3.0.0-preview.2...v3.0.0-rc.3

v2.11.1

We're excited to announce our v2.11.1 release of the Microsoft Graph Toolkit 🦒! In this minor release, we did 1 fix to solve issues with React dependencies.

Updating your application

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

npm i @microsoft/mgt@latest

If you’re using the Toolkit via mgt-loader, your application will be automatically updated to the newest version.

🐞 Fixes

• Remove react peer dependency by @gavinbarron in #2389

📃Changelog

The full changelog is available here