Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: storybook overview component links #3223

Merged
merged 3 commits into from
Jun 13, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 20 additions & 20 deletions stories/overview.stories.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ The Microsoft Graph Toolkit is a collection of reusable, framework-agnostic comp

<img src="graff.png" className="docs-img-centered" alt="graph logo" width="15%"/>

The Microsoft Graph Toolkit makes it easy to use Microsoft Graph in your application. In this [example](?path=/story/samples-general--login-to-show-agenda), a signed in user and their calendar events are displayed with just two lines of code by using the [Login](?path=/story/components-mgt-login--login) and [Agenda](?path=/story/components-mgt-agenda--simple) components.
The Microsoft Graph Toolkit makes it easy to use Microsoft Graph in your application. In this [example of a signed in user's calendar events](?path=/story/samples-general-html--calendar), the events are displayed with just two lines of code by using the [Login](?path=/story/components-mgt-login-html--login) and [Agenda](?path=/story/components-mgt-agenda-html--agenda) components.

<p>This site is providing documentation for version {PACKAGE_VERSION} of the Microsoft Graph Toolkit.</p>

Expand Down Expand Up @@ -46,25 +46,25 @@ The Microsoft Graph Toolkit includes a collection of web components for the most

The components are also available as [React components](https://learn.microsoft.com/graph/toolkit/get-started/mgt-react).

| Component | Description |
| ---------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| [Agenda](?path=/story/components-mgt-agenda--simple) | Displays events in a user or group's calendar. |
| [File](?path=/story/components-mgt-file--file) | Represents a file or folder with icon, filename, author, and more. |
| [File list](?path=/story/components-mgt-file-list--file-list) | Displays a list of multiple files or folders. |
| [Get](?path=/story/components-mgt-get--get-email) | Make a GET query to any Microsoft Graph API directly in your HTML. |
| [Login](?path=/story/components-mgt-login--login) | A button and a flyout control to authenticate a user with the Microsoft Identity platform and display the user's profile information on sign in. |
| [People](?path=/story/components-mgt-people--people) | Displays a group of people or contacts by their photos or initials. |
| [People picker](?path=/story/components-mgt-people-picker--people-picker) | Provides the ability to search for people and renders the list of results. |
| [Person](?path=/story/components-mgt-person--person) | Displays a person or contact by their photo, name, and/or email address. |
| [Person card](?path=/story/components-mgt-person-card--person-card) | A flyout used on the person component to display more profile information about a user. |
| [Picker](?path=/story/components-mgt-picker--picker) | Displays a generic picker that allows for picking of Microsoft Graph entities. |
| [Planner](?path=/story/components-mgt-planner--tasks) | Displays and enables adding, removing, completing, or editing of tasks from Microsoft Planner. |
| [Search Box](?path=/story/preview-mgt-search-box--search-box) | An input box for search scenarios. |
| [Seach Results](?path=/story/preview-mgt-search-results--search-results) | A component for executing search queries and displaying search results. |
| [Taxonomy picker](?path=/story/components-mgt-taxonomy-picker--taxonomy-picker) | Use the taxonomy picker component to query the Microsoft Graph API for Taxonomy and render a dropdown control with terms. |
| [Teams channel picker](?path=/story/components-mgt-teams-channel-picker--teams-channel-picker) | Provides the ability to search for Microsoft Teams channels to select a channel from a rendered list of results. |
| [Theme toggle](?path=/story/components-mgt-theme-toggle--user-preference-driven) | Provides the ability to toggle between light and dark themes. |
| [To Do](?path=/story/components-mgt-todo--todos) | Displays and enables adding, removing, completing, or editing of tasks from Microsoft To Do. |
| Component | Description |
| --------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| [Agenda](?path=/story/components-mgt-agenda-html--agenda) | Displays events in a user or group's calendar. |
| [File](?path=/story/components-mgt-file-html--file) | Represents a file or folder with icon, filename, author, and more. |
| [File list](?path=/story/components-mgt-file-list-html--file-list) | Displays a list of multiple files or folders. |
| [Get](?path=/story/components-mgt-get-html--get-email) | Make a GET query to any Microsoft Graph API directly in your HTML. |
| [Login](?path=/story/components-mgt-login-html--login) | A button and a flyout control to authenticate a user with the Microsoft Identity platform and display the user's profile information on sign in. |
| [People](?path=/story/components-mgt-people-html--people) | Displays a group of people or contacts by their photos or initials. |
| [People picker](?path=/story/components-mgt-people-picker-html--people-picker) | Provides the ability to search for people and renders the list of results. |
| [Person](?path=/story/components-mgt-person-html--person) | Displays a person or contact by their photo, name, and/or email address. |
| [Person card](?path=/story/components-mgt-person-card-html--person-card) | A flyout used on the person component to display more profile information about a user. |
| [Picker](?path=/story/components-mgt-picker-html--picker) | Displays a generic picker that allows for picking of Microsoft Graph entities. |
| [Planner](?path=/story/components-mgt-planner-html--planner) | Displays and enables adding, removing, completing, or editing of tasks from Microsoft Planner. |
| [Search Box](?path=/story/components-mgt-search-box-html--search-box) | An input box for search scenarios. |
| [Seach Results](?path=/story/components-mgt-search-results-html--search-results) | A component for executing search queries and displaying search results. |
| [Taxonomy picker](?path=/story/components-mgt-taxonomy-picker-html--taxonomy-picker) | Use the taxonomy picker component to query the Microsoft Graph API for Taxonomy and render a dropdown control with terms. |
| [Teams channel picker](?path=/story/components-mgt-teams-channel-picker-html--teams-channel-picker) | Provides the ability to search for Microsoft Teams channels to select a channel from a rendered list of results. |
| [Theme toggle](?path=/story/components-mgt-theme-toggle-html--user-preference-driven) | Provides the ability to toggle between light and dark themes. |
| [To Do](?path=/story/components-mgt-todo-html--todos) | Displays and enables adding, removing, completing, or editing of tasks from Microsoft To Do. |

#### Providers

Expand Down
5 changes: 5 additions & 0 deletions stories/samples/general.html.stories.js
Original file line number Diff line number Diff line change
Expand Up @@ -237,3 +237,8 @@ export const IsSignedIn = () => html`
}
</script>
`;

export const Calendar = () => html`
<mgt-login></mgt-login></mgt-login>
<mgt-agenda group-by-day></mgt-agenda>
`;
Loading