# @pluginjs/classes

> A flexible modern classes js plugin.

Latest version **0.8.10** (published 2022-08-29) · GPL-3.0 license · 0 weekly downloads

## Install

```sh
npm install @pluginjs/classes
pnpm add @pluginjs/classes
yarn add @pluginjs/classes
bun add @pluginjs/classes
```

## Health

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

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.8.10 |
| Published | 2022-08-29 |
| First published | 2018-04-09 |
| Weekly downloads | 0 |
| License | GPL-3.0 |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | >= 8 |
| Dependencies | 2 |
| Unpacked size | 19.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 17 |
| Author | Creation Studio Limited |
| Maintainers | thecreation, kaptinlin |

## Links

- npm: https://www.npmjs.com/package/@pluginjs/classes
- Repository: https://github.com/pluginjs/pluginjs
- Homepage: https://pluginjs.com
- Issues: https://github.com/pluginjs/pluginjs/issues
- npm.io page: https://npm.io/package/@pluginjs/classes

## Dependencies (2)

- [@pluginjs/is](https://npm.io/package/@pluginjs/is.md) ^0.8.9
- [@pluginjs/utils](https://npm.io/package/@pluginjs/utils.md) ^0.8.10

## Recent versions

- 0.8.10 (latest) — 2022-08-29
- 0.8.9 — 2022-01-08
- 0.8.8 — 2021-09-26
- 0.8.7 — 2021-07-01
- 0.8.6 — 2021-03-25
- 0.8.5 — 2021-03-01
- 0.8.4 — 2020-07-11
- 0.8.3 — 2020-02-11
- 0.8.2 — 2020-02-11
- 0.7.20 — 2020-01-15
- 0.7.19 — 2019-12-17
- 0.7.18 — 2019-12-16
- 0.7.17 — 2019-12-16
- 0.7.16 — 2019-09-20
- 0.7.15 — 2019-08-06
- … 25 more at https://npm.io/package/@pluginjs/classes/versions

## README

# Classes

[![npm package](https://img.shields.io/npm/v/@pluginjs/classes.svg)](https://www.npmjs.com/package/@pluginjs/classes)

`classes` is a utility JavaScript library for control class interfaces.

## Introduction
### Installation

#### Yarn

```javascript
yarn add @pluginjs/classes
```

#### NPM

```javascript
npm i @pluginjs/classes
```

## Getting Started

**CDN:**

Development:

```html
<script src="https://unpkg.com/@pluginjs/classes/dist/classes.js"></script>
```

Production:

```html
<script src="https://unpkg.com/@pluginjs/classes/dist/classes.min.js"></script>
```

## API

### addClass

Add specified class values. If these classes already exist in attribute of the element, then they are ignored.

Parameters

| Name | Type | Description |
|||-|
| className | `String[]` | function rest parameter |

Returns

| Name | Type | Description |
|||-|
| element | `HTMLElement` | |

### removeClass

Remove specified class values.

Parameters

| Name | Type | Description |
|||-|
| className | `String[]` | function rest parameter |

Returns

| Name | Type | Description |
|||-|
| element | `HTMLElement` | |

### indexOfClass

Return class value by index in collection.

Parameters

| Name | Type | Description |
|||-|
| className | `String` | |
| element | `HTMLElement` | |

Returns

| Name | Type | Description |
|||-|
| index | `Number` | index of class |

### hasClass

Checks if specified class value exists in class attribute of the element.

Parameters

| Name | Type | Description |
|||-|
| className | `String` | |
| element | `HTMLElement` | |

Returns

| Name | Type | Description |
|||-|
| hasClass | `Boolean` | |

### toggleClass

Toggle class value; i.e., if class exists then remove it and return false, if not, then add it and return true.

Parameters

| Name | Type | Description |
|||-|
| className | `String` | |
| element | `HTMLElement` | |

Returns

| Name | Type | Description |
|||-|
| element | `HTMLElement` | |

## Browser support

Tested on all major browsers.

| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
| --------- | --------- | --------- | --------- | --------- |
| IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions|

## License

@pluginjs/classes is Licensed under [the GPL-v3 license](LICENSE).

If you want to use @pluginjs/classes project to develop commercial sites, themes, projects, and applications, the Commercial license is the appropriate license. With this option, your source code is kept proprietary.

For purchase an Commercial License, contact us purchase@thecreation.co.

## Copyright

Copyright (C) 2022 [Creation Studio Limited](creationstudio.com).

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