Grid Components

This library is designed to provide reusable UI components for react project. This component library is structured to ensure consistency and efficiency across project.

Table of Contents

• Installation
• Configuring Components
• Accessing Props Declaration In Typescript

Installation

All configurations are bundled in the package @thesgpgridapp/grid-components. Follow the steps below:

# If you are using yarn
yarn add @thesgpgridapp/grid-components

# If you are using npm
npm i @thesgpgridapp/grid-components

Configuring Components

Import grid-components CSS file to your root project or layout.

import '@thesgpgridapp/grid-components/index.css';

After styles added, grid-components is ready to use. Here is example how grid-components can be used:

import {Button} from '@thesgpgridapp/grid-components';

...
<Button size='small'>Button</Button>

It also can be used this way:

import Button from '@thesgpgridapp/grid-components/components/Button';

...
<Button size='small'>Button</Button>

Accessing Props Declaration In Typescript

If you are using typescript and need access to component props. You can import it like this:

import Button, {IButtonProps} from '@thesgpgridapp/grid-components/components/Button';