Extract a component

This section will explain to extract a jumbo component in your custom theme. To extract a component follow steps given below:

For example we are exacting below component

Create React App With Material-UI

If you starting your new app with scratch. then create a react app and install Material-UI by running following command:

// with yarn
$ yarn add @material-ui/core @material-ui/icons @material-ui/lab
​
// with npm
$ npm install --save @material-ui/core @material-ui/icons @material-ui/lab

Copy Component

Copy above metioned component from Jumbo into your React and Material theme. You will find above component in two parts in cre-demo.zip file:

First Part you will found at here: src / routes / Dashboards / Crypto / InviteFriend

Second part you will found at here: src / @jumbo / components / Common / InviteFriendForm

InviteFriendForm is imported in InviteFriend component.

Copy Coremat UI kit

We are using Coremat Ui kit in our Jumbo template. So you have to copy Coremat Ui kit in your template from Jumbo template.

Install Required Packages

Now install required package by Coremat Ui . To install run following command:

// with yarn
$ yarn add @material-ui/core @material-ui/icons @material-ui/lab clsx prop-types react-bottom-scroll-listener react-perfect-scrollbar slick-carousel react-slick
​
// with npm
$ npm install --save @material-ui/core @material-ui/icons @material-ui/lab clsx prop-types react-bottom-scroll-listener react-perfect-scrollbar slick-carousel react-slick

Import Component

Now finally import InviteFriend component in your template component where you want to use. For example

import React from 'react';
import { InviteFriend } from './InviteFriend';
​
function App() {
  return <InviteFriend />;
}