A React implementation of Myntra's UI framework for enterprise design system
Myntra's UI framework for enterprise design system is a comprehensive solution for front-end development. With a focus on user experience (UX) and intuitive user interface (UI), our framework integrates the latest design practices to create a seamless experience for users.
The framework is built using React and TypeScript, providing robust and scalable components for fast-paced development.
Our framework offers a diverse range of components, including both basic elements such as Text and Button, as well as more complex components like Virtual List and Schema Form.
Run the following command using npm:
npm install @applique-ui/uikit --saveIf you prefer Yarn, use the following command instead:
yarn add @applique-ui/uikit- Import any of the provided components directly in your project:
import { Button, Layout, Text } from "@applique-ui/uikit"- Tell React to render the element in the DOM:
ReactDOM.render(
<Provider>
<Layout>
<Text.Title>Page Title</Text.Title>
<Button onClick={() => alert('Button clicked!')}>Example button</Button>
</Layout>
</Provider>,
document.querySelector('#app'),
);Our framework includes seamless integration of icons with select components like Button and NavBar, passed as React elements to the relevant component.
We provide a basic set of icons for immediate use, as well as the option to utilize custom icons for a personalized touch.
Run the following command using npm:
npm install @applique-ui/uikit-icons --saveIf you prefer Yarn, use the following command instead:
yarn add @applique-ui/uikit-icons- Import any of the provided icons directly in your project:
import BarsSolid from "@applique-ui/uikit-icons/svgs/BarsSolid"
import Bell from "@applique-ui/uikit-icons/svgs/Bell"
import BoxSolid from "@applique-ui/uikit-icons/svgs/BoxSolid"- Pass this icon element as a prop to the component:
<Icon name={BarsSolid} />
<Button icon={Bell}>Pencil</Button>
<NavBar.Item icon={BoxSolid}>Home</NavBar.Item>Contributions through pull requests are encouraged. For further information, refer to the contribution guidelines.