diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx index 41d49813b..b26b58dd6 100644 --- a/.storybook/preview.tsx +++ b/.storybook/preview.tsx @@ -14,23 +14,9 @@ const preview: Preview = { storySort: { order: [ 'About', - [ - 'Introduction', - 'Changelog', - 'FAQ', - 'Feedback', - 'Component Process', - [ - 'Introduction', - 'Components', - ['Using components', 'Change process'], - 'Candidate Components', - ['Introducing new ones', 'Using existing ones', 'Promoting to a component'], - 'Design Templates', - ], - ], + ['Introduction', 'Changelog', 'Feedback', 'Component Process'], 'Foundations', - ['Colors', 'Typography', 'Icons', 'Errors', 'Loading'], + ['Typography', 'Icons', 'Color Palette'], 'Components', [ 'Data Display', diff --git a/docs/About/Component Process.mdx b/docs/About/Component Process.mdx new file mode 100644 index 000000000..4767f6387 --- /dev/null +++ b/docs/About/Component Process.mdx @@ -0,0 +1,7 @@ +# Component Process + +We have a process around introducing new components into the library. This process is designed to ensure that the components we add are well-designed, +well-documented, and well-tested. See the link above to understand more about it. + +[Component Process Figjam](https://www.figma.com/board/jRyvM0L4fWa8j1NmE5tZ7y/Component-Process) +[Component Library & Custom Component Process](https://docs.google.com/document/d/1VvnaEzl_IBSMBMmPdGMnkX1FScQWBs5D8QYY2NuS9GI/edit?tab=t.0#heading=h.2z05vt46ooti) diff --git a/docs/About/Component Process/Candidate Components/Introducing new ones.mdx b/docs/About/Component Process/Candidate Components/Introducing new ones.mdx deleted file mode 100644 index c007a6fe0..000000000 --- a/docs/About/Component Process/Candidate Components/Introducing new ones.mdx +++ /dev/null @@ -1,3 +0,0 @@ -# Introducing new candidate components - -TBD \ No newline at end of file diff --git a/docs/About/Component Process/Candidate Components/Promoting to a component.mdx b/docs/About/Component Process/Candidate Components/Promoting to a component.mdx deleted file mode 100644 index f46664c3b..000000000 --- a/docs/About/Component Process/Candidate Components/Promoting to a component.mdx +++ /dev/null @@ -1,3 +0,0 @@ -# Promoting to a component - -TBD \ No newline at end of file diff --git a/docs/About/Component Process/Candidate Components/Using existing ones.mdx b/docs/About/Component Process/Candidate Components/Using existing ones.mdx deleted file mode 100644 index f870ee8e0..000000000 --- a/docs/About/Component Process/Candidate Components/Using existing ones.mdx +++ /dev/null @@ -1,19 +0,0 @@ -import { Mermaid } from 'mdx-mermaid/Mermaid'; - -# Using existings candidate components - - B - - B[Designer reviews the project needs and identifies a needs for customization or componetization]:::design --> C - - C[Unify: Trigger source of truth update by creating a ticket to Unify squad for updating Storybook. Start tracking usage in the rule of 3.]:::engineering --> D - - D[Design Handoff. Designer communicates to the project team that a new component candidate is introduced in the handoff]:::design --> E - - E[Implement it using Aquarium atoms directly in the platforms]:::engineering -`} /> diff --git a/docs/About/Component Process/Components/Change process.mdx b/docs/About/Component Process/Components/Change process.mdx deleted file mode 100644 index 8df0d224b..000000000 --- a/docs/About/Component Process/Components/Change process.mdx +++ /dev/null @@ -1,3 +0,0 @@ -# Change process - -TBD \ No newline at end of file diff --git a/docs/About/Component Process/Components/Using components.mdx b/docs/About/Component Process/Components/Using components.mdx deleted file mode 100644 index fe87e3fde..000000000 --- a/docs/About/Component Process/Components/Using components.mdx +++ /dev/null @@ -1,3 +0,0 @@ -# Using components - -TBD \ No newline at end of file diff --git a/docs/About/Component Process/Design Templates/Introduction.mdx b/docs/About/Component Process/Design Templates/Introduction.mdx deleted file mode 100644 index 49e3d1d32..000000000 --- a/docs/About/Component Process/Design Templates/Introduction.mdx +++ /dev/null @@ -1,3 +0,0 @@ -# Design Templates - -TBD \ No newline at end of file diff --git a/docs/About/Component Process/Introduction.mdx b/docs/About/Component Process/Introduction.mdx deleted file mode 100644 index 859526c36..000000000 --- a/docs/About/Component Process/Introduction.mdx +++ /dev/null @@ -1,3 +0,0 @@ -# Introduction - -TBD \ No newline at end of file diff --git a/docs/About/FAQ.mdx b/docs/About/FAQ.mdx deleted file mode 100644 index e1e56fa86..000000000 --- a/docs/About/FAQ.mdx +++ /dev/null @@ -1,6 +0,0 @@ -# FAQ - -### What should I do if I can't implement my design specs using Antd atoms? - -Please ask questions about it in the #aquarium channel. Ideally have a branch with your work in progress and some Storybook -stories so that we can see what you're trying to do. \ No newline at end of file diff --git a/docs/About/Feedback.mdx b/docs/About/Feedback.mdx index 9c8d76dfa..c514d21c9 100644 --- a/docs/About/Feedback.mdx +++ b/docs/About/Feedback.mdx @@ -2,6 +2,4 @@ We’re constantly working to improve our UI Library, and your feedback is invaluable in making it better. Whether you’ve encountered an issue, have suggestions for new components, or just want to share your experience, we’d love to hear from you! -To provide feedback, simply click the link below to access our feedback form or drop your thoughts directly in the `#Aquarium` channel on Slack. We review all submissions carefully and appreciate your time! - -[Submit Feedback](https://docs.google.com/forms/d/e/1FAIpQLScF_uUFfATYR64z-toPMkPrHvbmDE_mzYQyQ9M-QJjrZTQ68Q/viewform?usp=sf_link) +To provide feedback, drop your thoughts directly in the `#aquarium` channel on Slack. We review all submissions carefully and appreciate your time! diff --git a/docs/About/Introduction.mdx b/docs/About/Introduction.mdx index 81502ac7d..e884e9258 100644 --- a/docs/About/Introduction.mdx +++ b/docs/About/Introduction.mdx @@ -1,20 +1,12 @@ -# Introduction +# Introduction - mParticle UI Library -This is where all component related documentation will live at mParticle. This is mainly a work in progress at this point -and we are actively working on it. +Designed for developers, designers, and product managers, this library makes it easy to create intuitive, interactive interfaces for **mParticle applications**. -## How to read this +## Key Features -TBD +- **Foundations:** Design elements like colors, typography, spacing, and icons. +- **Components:** Ant Design-based, scalable, and ready to use. +- **Pattern Library:** The system we rely on to build the **mParticle application**. +- **Interactive Examples:** Practical demos to help you get started quickly. -## Glossary - -| Term | Meaning | -| -------- | ------- | -| Component Candidate | TBD | -| Template | TBD | -| Eames | TBD | -| Aquarium | TBD | -| Antd | TBD | - ---- \ No newline at end of file +Simple, flexible, and reliable—this library helps you focus on building great experiences without worrying about the basics. diff --git a/docs/Foundations/Base Palette.mdx b/docs/Foundations/Color Palette/Base Palette.mdx similarity index 100% rename from docs/Foundations/Base Palette.mdx rename to docs/Foundations/Color Palette/Base Palette.mdx diff --git a/docs/Foundations/Brand Palette.mdx b/docs/Foundations/Color Palette/Brand Palette.mdx similarity index 100% rename from docs/Foundations/Brand Palette.mdx rename to docs/Foundations/Color Palette/Brand Palette.mdx diff --git a/docs/Foundations/Semantic Palette.mdx b/docs/Foundations/Color Palette/Semantic Palette.mdx similarity index 100% rename from docs/Foundations/Semantic Palette.mdx rename to docs/Foundations/Color Palette/Semantic Palette.mdx diff --git a/docs/Foundations/Typography.mdx b/docs/Foundations/Typography/Typography.mdx similarity index 100% rename from docs/Foundations/Typography.mdx rename to docs/Foundations/Typography/Typography.mdx diff --git a/docs/components/Navigation/Anchor/Documentation.mdx b/docs/components/Navigation/Anchor/Documentation.mdx new file mode 100644 index 000000000..8eac30bab --- /dev/null +++ b/docs/components/Navigation/Anchor/Documentation.mdx @@ -0,0 +1,15 @@ +import { Meta, Canvas } from '@storybook/blocks' + +import * as AnchorStories from '../../../../src/components/navigation/Anchor/Anchor.stories' + + + +{/* Documentation goes here */} + +# Anchor + +This is the documentation for the Anchor component + +{/* Documentation goes here */} + + diff --git a/docs/components/Navigation/Breadcrumb/Documentation.mdx b/docs/components/Navigation/Breadcrumb/Documentation.mdx new file mode 100644 index 000000000..19e5d2abe --- /dev/null +++ b/docs/components/Navigation/Breadcrumb/Documentation.mdx @@ -0,0 +1,15 @@ +import { Meta, Canvas } from '@storybook/blocks' + +import * as BreadcrumbStories from '../../../../src/components/navigation/Breadcrumb/Breadcrumb.stories' + + + +{/* Documentation goes here */} + +# Breadcrumb + +This is the documentation for the Breadcrumb component + +{/* Documentation goes here */} + + diff --git a/docs/components/Navigation/Dropdown/Documentation.mdx b/docs/components/Navigation/Dropdown/Documentation.mdx new file mode 100644 index 000000000..b7c66c2ee --- /dev/null +++ b/docs/components/Navigation/Dropdown/Documentation.mdx @@ -0,0 +1,15 @@ +import { Meta, Canvas } from '@storybook/blocks' + +import * as DropdownStories from '../../../../src/components/navigation/Dropdown/Dropdown.stories' + + + +{/* Documentation goes here */} + +# Dropdown + +This is the documentation for the Dropdown component + +{/* Documentation goes here */} + + diff --git a/docs/components/Navigation/GlobalNavigation/Documentation.mdx b/docs/components/Navigation/GlobalNavigation/Documentation.mdx new file mode 100644 index 000000000..9423afe59 --- /dev/null +++ b/docs/components/Navigation/GlobalNavigation/Documentation.mdx @@ -0,0 +1,15 @@ +import { Meta, Canvas } from '@storybook/blocks' + +import * as GlobalNavigationStories from '../../../../src/components/navigation/GlobalNavigation/GlobalNavigation.stories' + + + +{/* Documentation goes here */} + +# GlobalNavigation + +This is the documentation for the GlobalNavigation component + +{/* Documentation goes here */} + + diff --git a/docs/components/Navigation/Menu/Documentation.mdx b/docs/components/Navigation/Menu/Documentation.mdx new file mode 100644 index 000000000..6cb6f2401 --- /dev/null +++ b/docs/components/Navigation/Menu/Documentation.mdx @@ -0,0 +1,15 @@ +import { Meta, Canvas } from '@storybook/blocks' + +import * as MenuStories from '../../../../src/components/navigation/Menu/Menu.stories' + + + +{/* Documentation goes here */} + +# Menu + +This is the documentation for the Menu component + +{/* Documentation goes here */} + + diff --git a/docs/components/Navigation/Pagination/Documentation.mdx b/docs/components/Navigation/Pagination/Documentation.mdx new file mode 100644 index 000000000..1935ae587 --- /dev/null +++ b/docs/components/Navigation/Pagination/Documentation.mdx @@ -0,0 +1,15 @@ +import { Meta, Canvas } from '@storybook/blocks' + +import * as PaginationStories from '../../../../src/components/navigation/Pagination/Pagination.stories' + + + +{/* Documentation goes here */} + +# Pagination + +This is the documentation for the Pagination component + +{/* Documentation goes here */} + + diff --git a/docs/components/Navigation/Steps/Documentation.mdx b/docs/components/Navigation/Steps/Documentation.mdx new file mode 100644 index 000000000..d59dfe9ae --- /dev/null +++ b/docs/components/Navigation/Steps/Documentation.mdx @@ -0,0 +1,15 @@ +import { Meta, Canvas } from '@storybook/blocks' + +import * as StepsStories from '../../../../src/components/navigation/Steps/Steps.stories' + + + +{/* Documentation goes here */} + +# Steps + +This is the documentation for the Steps component + +{/* Documentation goes here */} + + diff --git a/src/components/navigation/Dropdown/Dropdown.stories.tsx b/src/components/navigation/Dropdown/Dropdown.stories.tsx index b45159f75..f3acef9be 100644 --- a/src/components/navigation/Dropdown/Dropdown.stories.tsx +++ b/src/components/navigation/Dropdown/Dropdown.stories.tsx @@ -94,7 +94,7 @@ type Story = StoryObj */ export const Primary: Story = { - tags: ['deprecated'], + // tags: ['deprecated'], } export const WithArrow: Story = {