docs: update documentation to use specific packages (#2696)

Co-authored-by: Musale Martin <[email protected]>
Co-authored-by: Gavin Barron <[email protected]>

Author: 3 people

.storybook/addons/codeEditorAddon/codeAddon.js

@@ -221,7 +221,7 @@ export const withCodeEditor = makeDecorator({
 
           let { html, css, js } = editor.files;
           js = js.replace(
-            /import \{([^\}]+)\}\s+from\s+['"]@microsoft\/mgt['"];/gm,
+            /import \{([^\}]+)\}\s+from\s+['"]@microsoft\/mgt\x2d([^\}]+)['"];/gm,
             `import {$1} from '${mgtScriptName}';`
           );
 

stories/components/file/file.stories.js

@@ -34,7 +34,7 @@ export const RTL = () => html`
 export const localization = () => html`
   <mgt-file file-query="/me/drive/items/01BYE5RZZFWGWWVNHHKVHYXE3OUJHGWCT2" view="threelines"></mgt-file>
   <script>
-  import { LocalizationHelper } from '@microsoft/mgt';
+  import { LocalizationHelper } from '@microsoft/mgt-element';
   LocalizationHelper.strings = {
     _components: {
       'file': {

stories/components/fileList/fileList.stories.js

@@ -34,7 +34,7 @@ export const RTL = () => html`
 export const localization = () => html`
   <mgt-file-list></mgt-file-list>
   <script>
-  import { LocalizationHelper } from '@microsoft/mgt';
+  import { LocalizationHelper } from '@microsoft/mgt-element';
   LocalizationHelper.strings = {
     _components: {
       'file-list': {

stories/components/login/login.stories.js

@@ -118,7 +118,7 @@ export const Events = () => html`
 export const localization = () => html`
   <mgt-login></mgt-login>
   <script>
-  import { LocalizationHelper } from '@microsoft/mgt';
+  import { LocalizationHelper } from '@microsoft/mgt-element';
   LocalizationHelper.strings = {
     _components: {
       login: {

stories/components/peoplePicker/peoplePicker.properties.js

@@ -89,7 +89,7 @@ export const dynamicGroupId = () => html`
     }
   </style>
   <script type="module">
-    import { Providers, ProviderState } from '@microsoft/mgt';
+    import { Providers, ProviderState } from '@microsoft/mgt-element';
 
     let picker = document.getElementById('picker');
     let chosenArea = document.getElementById('chosenPeople');

stories/components/peoplePicker/peoplePicker.stories.js

@@ -60,7 +60,7 @@ export const selectUsersById = () => html`
 export const localization = () => html`
    <mgt-people-picker></mgt-people-picker>
    <script>
-   import { LocalizationHelper } from '@microsoft/mgt';
+   import { LocalizationHelper } from '@microsoft/mgt-element';
    LocalizationHelper.strings = {
      _components: {
        'people-picker': {

stories/components/personCard/personCard.stories.js

@@ -59,7 +59,7 @@ export const RTL = () => html`
 export const localization = () => html`
   <mgt-person-card person-query="me"></mgt-person-card>
   <script>
-  import { LocalizationHelper } from '@microsoft/mgt';
+  import { LocalizationHelper } from '@microsoft/mgt-element';
   LocalizationHelper.strings = {
     _components: {
       login: {

stories/components/preview/searchBox/searchBox.stories.js

@@ -28,7 +28,7 @@ export const searchBox = () => html`
 export const localization = () => html`
   <mgt-search-box></mgt-search-box>
   <script>
-  import { LocalizationHelper } from '@microsoft/mgt';
+  import { LocalizationHelper } from '@microsoft/mgt-element';
   LocalizationHelper.strings = {
     _components: {
       'search-box': {

stories/components/preview/searchResults/searchResults.stories.js

@@ -33,7 +33,7 @@ export const localization = () => html`
   <mgt-search-results entity-types="driveItem" query-string="contoso">
   </mgt-search-results>
   <script>
-  import { LocalizationHelper } from '@microsoft/mgt';
+  import { LocalizationHelper } from '@microsoft/mgt-element';
   LocalizationHelper.strings = {
     _components: {
       'search-results': {

stories/components/teamsChannelPicker/teamsChannelPicker.stories.js

@@ -94,7 +94,7 @@ export const RTL = () => html`
 export const Localization = () => html`
   <mgt-teams-channel-picker></mgt-teams-channel-picker>
   <script>
-  import { LocalizationHelper } from '@microsoft/mgt';
+  import { LocalizationHelper } from '@microsoft/mgt-element';
     LocalizationHelper.strings = {
         _components: {
             "teams-channel-picker": {