Storybook: update deprecated code in v6+ (#1508)

Author: musale

stories/components/agenda/agenda.a.js

@@ -9,7 +9,7 @@ import { html } from 'lit-element';
 import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Components | mgt-agenda',
+  title: 'Components / mgt-agenda',
   component: 'mgt-agenda',
   decorators: [withCodeEditor]
 };

stories/components/file/file.a.js

@@ -9,7 +9,7 @@ import { html } from 'lit-element';
 import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Components | mgt-file',
+  title: 'Components / mgt-file',
   component: 'mgt-file',
   decorators: [withCodeEditor]
 };

stories/components/fileList/fileList.a.js

@@ -9,7 +9,7 @@ import { html } from 'lit-element';
 import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Components | mgt-file-list',
+  title: 'Components / mgt-file-list',
   component: 'mgt-file-list',
   decorators: [withCodeEditor]
 };

stories/components/people/people.a.js

@@ -9,7 +9,7 @@ import { html } from 'lit-element';
 import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Components | mgt-people',
+  title: 'Components / mgt-people',
   component: 'mgt-people',
   decorators: [withCodeEditor]
 };

stories/components/peoplePicker/peoplePicker.a.js

@@ -9,7 +9,7 @@ import { html } from 'lit-element';
 import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Components | mgt-people-picker',
+  title: 'Components / mgt-people-picker',
   component: 'mgt-people-picker',
   decorators: [withCodeEditor]
 };
@@ -74,10 +74,9 @@ export const copyOrCutToPaste = () => html`
    <mgt-people-picker></mgt-people-picker>
  `;
 
-
 export const pasteListOfUserIds = () => html`
 <mgt-people-picker></mgt-people-picker>
 <!-- You can paste emails or user IDs that are delimited with a comma(",") or semi-colon(";") -->
 <!-- 48d31887-5fad-4d73-a9f5-3c356e68a038,24fcbca3-c3e2-48bf-9ffc-c7f81b81483d -->
 <!-- [email protected];[email protected];[email protected]>
-`
+`;

stories/components/person/person.style.js

@@ -9,7 +9,7 @@ import { html } from 'lit-element';
 import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Components | mgt-person / Style',
+  title: 'Components / mgt-person / Style',
   component: 'mgt-person',
   decorators: [withCodeEditor]
 };

stories/components/personCard/personCard.a.js

@@ -9,7 +9,7 @@ import { html } from 'lit-element';
 import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Components | mgt-person-card',
+  title: 'Components / mgt-person-card',
   component: 'mgt-person-card',
   decorators: [withCodeEditor]
 };

stories/components/teamsChannelPicker/teamsChannelPicker.a.js

@@ -9,7 +9,7 @@ import { html } from 'lit-element';
 import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Components | mgt-teams-channel-picker',
+  title: 'Components / mgt-teams-channel-picker',
   component: 'mgt-teams-channel-picker',
   decorators: [withCodeEditor]
 };
@@ -82,7 +82,6 @@ export const RTL = () => html`
   </body>
 `;
 
-
 export const Localization = () => html`
   <mgt-teams-channel-picker></mgt-teams-channel-picker>
   <script>

stories/feedback.stories.mdx

@@ -1,4 +1,4 @@
-import { Meta } from '@storybook/addon-docs/blocks';
+import { Meta } from '@storybook/addon-docs';
 
 <Meta title="Feedback" />
 

stories/overview.stories.mdx

@@ -1,8 +1,8 @@
-import { Meta } from '@storybook/addon-docs/blocks';
+import { Meta } from '@storybook/addon-docs';
 
 <Meta title="Overview" />
 
-# Microsoft Graph Toolkit: UI Components and Authentication Providers for Microsoft Graph 
+# Microsoft Graph Toolkit: UI Components and Authentication Providers for Microsoft Graph
 
 The Microsoft Graph Toolkit is a collection of reusable, framework-agnostic components and authentication providers for accessing and working with Microsoft Graph. The components are fully functional right of out of the box, with built in providers that authenticate with and fetch data from Microsoft Graph.
 
@@ -30,7 +30,7 @@ npm i @microsoft/mgt
 
 ### Components
 
-The Microsoft Graph Toolkit includes a collection of web components for the most commonly built experiences powered by Microsoft Graph APIs. 
+The Microsoft Graph Toolkit includes a collection of web components for the most commonly built experiences powered by Microsoft Graph APIs.
 
 The components are also available as [React components](https://docs.microsoft.com/graph/toolkit/get-started/mgt-react).
 
@@ -67,6 +67,7 @@ The components are also available as [React components](https://docs.microsoft.c
 ## Who should use it?
 
 The Microsoft Graph Toolkit is great for developers of all experience levels looking to develop an app that connects to and accesses data from Microsoft Graph, such as a:
+
 - Web app
 - Microsoft Teams tab
 - SharePoint web part
@@ -81,9 +82,8 @@ The Microsoft Graph Toolkit is supported in the following browsers.
 | --------------------------------------------------------------------- | --------------------------------------------------------------------------- | ------------------------------------------------------------------------- | ------------------------------------------------------------------------- | ----------------------------------------------------------------------- | -------------------------------------------------------------------------------------------- |
 | **Edge**                                                              | **Firefox**                                                                 | **Chrome**                                                                | **Safari**                                                                | **Opera**                                                               | **Samsung**                                                                                  |
 
-
 ## Next steps
 
 - Read our [documentation](https://aka.ms/mgt/docs).
 - [Get started](https://docs.microsoft.com/graph/toolkit/get-started/overview) with the Microsoft Graph Toolkit.
-- Check out the Microsoft Graph Toolkit on [GitHub](https://aka.ms/mgt).
+- Check out the Microsoft Graph Toolkit on [GitHub](https://aka.ms/mgt).