# infinity-modules-bas

> This is a set of components which you can use in your projects. It is made up of the following components:

Latest version **0.1.7** (published 2022-03-21) · 0 weekly downloads

## Install

```sh
npm install infinity-modules-bas
pnpm add infinity-modules-bas
yarn add infinity-modules-bas
bun add infinity-modules-bas
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.7 |
| Published | 2022-03-21 |
| First published | 2022-03-21 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 8 |
| Unpacked size | 167.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | sofiabasilio22 |

## Links

- npm: https://www.npmjs.com/package/infinity-modules-bas
- npm.io page: https://npm.io/package/infinity-modules-bas

## Dependencies (8)

- [react](https://npm.io/package/react.md) ^17.0.2
- [react-dom](https://npm.io/package/react-dom.md) ^17.0.2
- [web-vitals](https://npm.io/package/web-vitals.md) ^2.1.4
- [npm-run-all](https://npm.io/package/npm-run-all.md) ^4.1.5
- [react-scripts](https://npm.io/package/react-scripts.md) 5.0.0
- [@testing-library/react](https://npm.io/package/@testing-library/react.md) ^12.1.4
- [@testing-library/jest-dom](https://npm.io/package/@testing-library/jest-dom.md) ^5.16.2
- [@testing-library/user-event](https://npm.io/package/@testing-library/user-event.md) ^13.5.0

## Recent versions

- 0.1.7 (latest) — 2022-03-21
- 0.1.2 — 2022-03-21

## README

# Welcome to Infinity Modules!

This is a set of components which you can use in your projects. It is made up of the following components:

## Modal

A simple modal which contains a title, body, and footer, used in the following way:
```
<h1> Modal </h1>
<button onClick={() => this.setState({isModalOpen:true})}>Open modal</button>
<Modal
    isOpen={isModalOpen}
    onClose={() => this.setState({ isModalOpen: false })
}>
    <Modal.Title>My Modal Title</Modal.Title>
    <Modal.Body>My Modal Body</Modal.Body>
    <Modal.Footer>My Modal Footer</Modal.Footer>
</Modal>
```

## Row and Col

Row and column are two components that are connected, the purpose is to create a row which contains columns of varying sizes.

```
<h1>Rows</h1>
<Row>
    <Col size={1}></Col>
    <Col size={2}></Col>
    <Col size={9}></Col>
    <Col size={12}></Col>
</Row>

```
## DatePicker

This component allows you to set a date and set its locale as well!

```
<DatePicker
    onDatePick={date => this.setState({date})}
    locale="en-EN" /> 
```

## Carousel

Your friendly carousel is a general slider which can take 3 different sizes of images (small, medium, large).

```
<h1>Carousel</h1>
<Carousel
    images={[
        "someimage1.png",
        "someimage2.png",
        "someimage3.png",
    ]}
    size="large"/>

```

## CartoonNetworkSpinner

A cute little spinner with images from some of my favorite cartoon network shows as a kid! As the name implies... they spin (at a certain interval)!
```
<h1>Cartoon Network Spinner</h1>
<CartoonNetworkSpinner interval={4}/>
```

---
_Source: https://npm.io/package/infinity-modules-bas · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._