next-core-components/README.md

HFN core components library for development in NextJS (Shared components)

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)

# HFN Next Components

> HFN Core Components Library for NextJS (Shared across multiple projects based on Strapi API response)

## Prerequisites

This project requires NodeJS (version v16.13.2 or later) and Yarn (Version 1.22.19 or later).
[Node](http://nodejs.org/) and [Yarn](https://yarnpkg.com/) are really easy to install.
To make sure you have them available on your machine,
try running the following command.

```sh
$ yarn -v && node -v
1.22.19
v16.13.2
```

## Table of contents

- [HFN Next Components](#hfn-next-components)
  - [Prerequisites](#prerequisites)
  - [Table of contents](#table-of-contents)
  - [Getting Started](#getting-started)
  - [Installation](#installation)
  - [Import Library](#import-library)
  - [Import Stylesheet](#import-stylesheet)
  - [Available components](#available-components)
  - [Explore More](#explore-more)
  - [Built With](#built-with)
  - [License](#license)

## Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.

## Installation

**BEFORE YOU INSTALL:** please read the [prerequisites](#prerequisites)

Start with cloning this repo on your local machine:

```sh
$ git clone https://github.com/HeartfulnessInstitute/hfn-core-components-nextjs.git

$ cd PROJECT
```

To install and set up the library, run:

```sh
$ npm install next-core-components
```

Or if you prefer using Yarn:

```sh
$ yarn add next-core-components
```

## Import Library

```sh
Example : HfnAccordion and HfnSlider

$ import { HfnAccordion, HfnSlider } from "next-core-components";
```

## Import Stylesheet

Theme, core and icons are the necessary css files of the components,please import
these files into app.jsx or your root file.

```sh
// theme
import "primereact/resources/themes/lara-light-indigo/theme.css";
// core
import "primereact/resources/primereact.min.css";
// icons
import "primeicons/primeicons.css";
// icons
import "next-core-components/dist/main.css";
```

## Available components

These below components are the available that can be imported from bundle.

`import { HfnAccordion, HfnSlider, HfnAudioPlayer,HfnCarousel, HfnImage, HfnPopup, HfnSeo, HfnTabs, HfnVideoPlayer } from "next-core-components"`

If present, the render will be performed as soon as the component is mounted

Example:

```jsx
import { HfnAccordion } from "next-core-components";

import React from "react";

export default function MyComponent(props) {
  return (
    <div>
      This compoenn extends HfnAccordion
      <HfnAccordion {...props} />
    </div>
  );
}
```

## Explore More

To know more about complete for props and configs for each component, visit our documentation with storybook.

[Documentation](http://nodejs.org/)

## Built With

- React
- NextJS
- HTML react parser
- Storybook
- Primereact

## License

[MIT License] © Heartfulness # hfn-core-components-nextjs