* docs: migrate ui docs to docs universe * created yarn workspace * added eslint and tsconfig configurations * fix eslint configurations * fixed eslint configurations * shared tailwind configurations * added shared ui package * added more shared components * migrating more components * made details components shared * move InlineCode component * moved InputText * moved Loading component * Moved Modal component * moved Select components * Moved Tooltip component * moved Search components * moved ColorMode provider * Moved Notification components and providers * used icons package * use UI colors in api-reference * moved Navbar component * used Navbar and Search in UI docs * added Feedback to UI docs * general enhancements * fix color mode * added copy colors file from ui-preset * added features and enhancements to UI docs * move Sidebar component and provider * general fixes and preparations for deployment * update docusaurus version * adjusted versions * fix output directory * remove rootDirectory property * fix yarn.lock * moved code component * added vale for all docs MD and MDX * fix tests * fix vale error * fix deployment errors * change ignore commands * add output directory * fix docs test * general fixes * content fixes * fix announcement script * added changeset * fix vale checks * added nofilter option * fix vale error
44 lines
1.5 KiB
Plaintext
44 lines
1.5 KiB
Plaintext
---
|
|
title: "Introduction"
|
|
description: "Primitives for building Medusa applications."
|
|
---
|
|
|
|
Welcome to Medusa UI, a React implementation of the Medusa design system.
|
|
It is a collection of components, hooks, utility functions, icons, and [Tailwind CSS](https://tailwindcss.com/) classes that can be used to build
|
|
a consistent user interface across the Medusa Admin and other Medusa applications.
|
|
|
|
<Card
|
|
title="Medusa UI"
|
|
text="Colors, type, icons and components"
|
|
href="https://www.figma.com/community/file/1278648465968635936/Medusa-UI"
|
|
icon={
|
|
<FigmaIcon />
|
|
}
|
|
/>
|
|
|
|
## Packages
|
|
|
|
---
|
|
|
|
Medusa UI is split into multiple packages. Each package is published to npm
|
|
and can be installed separately.
|
|
|
|
- `@medusajs/ui` - React components, hooks, and utility functions used
|
|
in Medusa UI.
|
|
- `@medusajs/ui-preset` - Tailwind CSS preset containing all the classes
|
|
used in Medusa UI.
|
|
- `@medusajs/icons` - Icons used in Medusa UI.
|
|
|
|
## About
|
|
|
|
---
|
|
|
|
At its core, Medusa UI is a styled and slightly opinionated implementation of [Radix Primitives](https://www.radix-ui.com/primitives).
|
|
Our team have also referenced the fantastic [shadcn/ui](https://ui.shadcn.com/) for inspiration in certain implementations.
|
|
|
|
Our team strongly believe in keeping the components simple and
|
|
composable, much like Medusa's foundation. This allows you to build whatever you need. Our team have tried to avoid overloading
|
|
the component API and, instead, leveraged the native HTML API, which gets implemented
|
|
and respected accordingly, and passed to the underlying elements.
|
|
|
|
<Feedback title={"Introduction"} /> |