feat: promoting search components to GA (#2909)

Promoting Search to GA Updated stories for GA --------- Co-authored-by: Gavin Barron <gavinbarron@microsoft.com>
microsoftgraph · Dec 11, 2023 · 86697f4 · 86697f4
1 parent 20eb7fc
commit 86697f4
Show file tree

Hide file tree

Showing 15 changed files with 33 additions and 35 deletions.
diff --git a/packages/mgt-components/src/components/components.ts b/packages/mgt-components/src/components/components.ts
@@ -24,6 +24,8 @@ import './mgt-contact/mgt-contact';
 import './mgt-messages/mgt-messages';
 import './mgt-organization/mgt-organization';
 import './mgt-profile/mgt-profile';
+import './mgt-search-box/mgt-search-box';
+import './mgt-search-results/mgt-search-results';
 import './mgt-theme-toggle/mgt-theme-toggle';
 import './sub-components/mgt-spinner/mgt-spinner';
 
@@ -49,7 +51,10 @@ export * from './mgt-contact/mgt-contact';
 export * from './mgt-messages/mgt-messages';
 export * from './mgt-organization/mgt-organization';
 export * from './mgt-profile/mgt-profile';
+export * from './mgt-search-box/mgt-search-box';
+export * from './mgt-search-results/mgt-search-results';
 export * from './mgt-theme-toggle/mgt-theme-toggle';
 export * from './sub-components/mgt-spinner/mgt-spinner';
 // include preview components here for ease of import into mgt-react
-export * from './preview';
+// There are no preview components in this package at this time
+// export * from './preview';
diff --git a/packages/mgt-components/src/components/mgt-search-box/mgt-search-box.scss b/packages/mgt-components/src/components/mgt-search-box/mgt-search-box.scss
@@ -0,0 +1,5 @@
+@import '../../styles/shared-styles';
+
+:host fluent-search {
+  width: 100%;
+}
diff --git a/.../preview/mgt-search-box/mgt-search-box.ts → ...mponents/mgt-search-box/mgt-search-box.ts b/.../preview/mgt-search-box/mgt-search-box.ts → ...mponents/mgt-search-box/mgt-search-box.ts
@@ -9,10 +9,10 @@ import { CSSResult, html, TemplateResult } from 'lit';
 import { property } from 'lit/decorators.js';
 import { MgtBaseComponent } from '@microsoft/mgt-element';
 import { fluentSearch } from '@fluentui/web-components';
-import { registerFluentComponents } from '../../../utils/FluentComponents';
+import { registerFluentComponents } from '../../utils/FluentComponents';
 import { strings } from './strings';
 import { styles } from './mgt-search-box-css';
-import { debounce } from '../../../utils/Utils';
+import { debounce } from '../../utils/Utils';
 import { registerComponent } from '@microsoft/mgt-element';
 
 export const registerMgtSearchBoxComponent = () => {
@@ -96,9 +96,6 @@ export class MgtSearchBox extends MgtBaseComponent {
 
   constructor() {
     super();
-    console.warn(
-      '🦒: <mgt-search-box> is a preview component and may change prior to becoming generally available. See more information https://aka.ms/mgt/preview-components'
-    );
     this.debounceDelay = 300;
   }
 

diff --git a/...ponents/preview/mgt-search-box/strings.ts → .../src/components/mgt-search-box/strings.ts b/...ponents/preview/mgt-search-box/strings.ts → .../src/components/mgt-search-box/strings.ts
diff --git a/...gt-search-results/mgt-search-results.scss → ...gt-search-results/mgt-search-results.scss b/...gt-search-results/mgt-search-results.scss → ...gt-search-results/mgt-search-results.scss
@@ -5,7 +5,7 @@
  * -------------------------------------------------------------------------------------------
  */
 
-@import '../../../styles/shared-styles';
+@import '../../styles/shared-styles';
 
 $answer-border-radius: var(--answer-border-radius, 4px);
 $answer-box-shadow: var(--answer-box-shadow, 0 3.2px 7.2px rgb(0 0 0 / 13.2%), 0 0.6px 1.8px rgb(0 0 0 / 10.8%));

diff --git a/.../mgt-search-results/mgt-search-results.ts → .../mgt-search-results/mgt-search-results.ts b/.../mgt-search-results/mgt-search-results.ts → .../mgt-search-results/mgt-search-results.ts
@@ -21,7 +21,7 @@ import {
   CollectionResponse
 } from '@microsoft/mgt-element';
 
-import { schemas } from '../../../graph/cacheStores';
+import { schemas } from '../../graph/cacheStores';
 import { strings } from './strings';
 import { styles } from './mgt-search-results-css';
 import {
@@ -46,14 +46,14 @@ import {
   getResponseInvalidationTime,
   sanitizeSummary,
   trimFileExtension
-} from '../../../utils/Utils';
-import { getSvg, SvgIcon } from '../../../utils/SvgHelper';
+} from '../../utils/Utils';
+import { getSvg, SvgIcon } from '../../utils/SvgHelper';
 import { fluentSkeleton, fluentButton, fluentTooltip, fluentDivider } from '@fluentui/web-components';
-import { registerFluentComponents } from '../../../utils/FluentComponents';
-import { CacheResponse } from '../../CacheResponse';
+import { registerFluentComponents } from '../../utils/FluentComponents';
+import { CacheResponse } from '../CacheResponse';
 import { registerComponent } from '@microsoft/mgt-element';
-import { registerMgtFileComponent } from '../../mgt-file/mgt-file';
-import { registerMgtPersonComponent } from '../../mgt-person/mgt-person';
+import { registerMgtFileComponent } from '../mgt-file/mgt-file';
+import { registerMgtPersonComponent } from '../mgt-person/mgt-person';
 
 /**
  * Object representing a thumbnail
@@ -407,9 +407,6 @@ export class MgtSearchResults extends MgtTemplatedComponent {
 
   constructor() {
     super();
-    console.warn(
-      '🦒: <mgt-search-results> is a preview component and may change prior to becoming generally available. See more information https://aka.ms/mgt/preview-components'
-    );
   }
 
   /**

diff --git a/...nts/preview/mgt-search-results/strings.ts → .../components/mgt-search-results/strings.ts b/...nts/preview/mgt-search-results/strings.ts → .../components/mgt-search-results/strings.ts
diff --git a/packages/mgt-components/src/components/preview/index.ts b/packages/mgt-components/src/components/preview/index.ts
@@ -1,2 +0,0 @@
-export * from './mgt-search-box/mgt-search-box';
-export * from './mgt-search-results/mgt-search-results';

diff --git a/packages/mgt-components/src/components/preview/mgt-search-box/mgt-search-box.scss b/packages/mgt-components/src/components/preview/mgt-search-box/mgt-search-box.scss
diff --git a/packages/mgt-components/src/exports.ts b/packages/mgt-components/src/exports.ts
@@ -6,7 +6,8 @@
  */
 
 export * from './components/components';
-export * from './components/preview';
+// There are no preview components in this package at this time
+// export * from './components/preview';
 export * from './graph/types';
 export * from './styles/theme-manager';
 export * from './graph/entityType';
diff --git a/...searchBox/searchBox.properties.stories.js → ...searchBox/searchBox.properties.stories.js b/...searchBox/searchBox.properties.stories.js → ...searchBox/searchBox.properties.stories.js
@@ -6,10 +6,10 @@
  */
 
 import { html } from 'lit';
-import { withCodeEditor } from '../../../../.storybook/addons/codeEditorAddon/codeAddon';
+import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Preview / mgt-search-box / Properties',
+  title: 'Components / mgt-search-box / Properties',
   component: 'search-box',
   decorators: [withCodeEditor]
 };

diff --git a/...ew/searchBox/searchBox.stories.stories.js → ...ts/searchBox/searchBox.stories.stories.js b/...ew/searchBox/searchBox.stories.stories.js → ...ts/searchBox/searchBox.stories.stories.js
@@ -6,10 +6,10 @@
  */
 
 import { html } from 'lit';
-import { withCodeEditor } from '../../../../.storybook/addons/codeEditorAddon/codeAddon';
+import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Preview / mgt-search-box',
+  title: 'Components / mgt-search-box',
   component: 'search-box',
   decorators: [withCodeEditor],
   tags: ['autodocs'],

diff --git a/...sults/searchResults.properties.stories.js → ...sults/searchResults.properties.stories.js b/...sults/searchResults.properties.stories.js → ...sults/searchResults.properties.stories.js
@@ -6,10 +6,10 @@
  */
 
 import { html } from 'lit';
-import { withCodeEditor } from '../../../../.storybook/addons/codeEditorAddon/codeAddon';
+import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Preview / mgt-search-results / Properties',
+  title: 'Components / mgt-search-results / Properties',
   component: 'search-results',
   decorators: [withCodeEditor]
 };

diff --git a/...ew/searchResults/searchResults.stories.js → ...ts/searchResults/searchResults.stories.js b/...ew/searchResults/searchResults.stories.js → ...ts/searchResults/searchResults.stories.js
@@ -6,10 +6,10 @@
  */
 
 import { html } from 'lit';
-import { withCodeEditor } from '../../../../.storybook/addons/codeEditorAddon/codeAddon';
+import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Preview / mgt-search-results',
+  title: 'Components / mgt-search-results',
   component: 'search-results',
   decorators: [withCodeEditor],
   tags: ['autodocs'],

diff --git a/...rchResults/searchResults.style.stories.js → ...rchResults/searchResults.style.stories.js b/...rchResults/searchResults.style.stories.js → ...rchResults/searchResults.style.stories.js
@@ -6,10 +6,10 @@
  */
 
 import { html } from 'lit';
-import { withCodeEditor } from '../../../../.storybook/addons/codeEditorAddon/codeAddon';
+import { withCodeEditor } from '../../../.storybook/addons/codeEditorAddon/codeAddon';
 
 export default {
-  title: 'Preview / mgt-search-results / Style',
+  title: 'Components / mgt-search-results / Style',
   component: 'search-results',
   decorators: [withCodeEditor]
 };