# @juratbek/editorjs-header

> Header Tool for Editor.js

Latest version **1.0.2** (published 2023-11-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install @juratbek/editorjs-header
pnpm add @juratbek/editorjs-header
yarn add @juratbek/editorjs-header
bun add @juratbek/editorjs-header
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.2 |
| Published | 2023-11-21 |
| First published | 2023-10-29 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 87.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Juratbek |
| Maintainers | upperuz |
| Keywords | header, tool, editor.js, editorjs |

## Links

- npm: https://www.npmjs.com/package/@juratbek/editorjs-header
- Repository: https://github.com/Juratbek/editorjs-header
- Homepage: https://github.com/Juratbek/editorjs-header#readme
- Issues: https://github.com/Juratbek/editorjs-header/issues
- npm.io page: https://npm.io/package/@juratbek/editorjs-header

## Dependencies (1)

- [@codexteam/icons](https://npm.io/package/@codexteam/icons.md) ^0.3.0

## Alternatives

- [lodash.assign](https://npm.io/package/lodash.assign.md) — 2.3M weekly downloads
- [lodash.chunk](https://npm.io/package/lodash.chunk.md) — 1.8M weekly downloads
- [react-native-ios-utilities](https://npm.io/package/react-native-ios-utilities.md) — 138.5K weekly downloads
- [@technically/lodash](https://npm.io/package/@technically/lodash.md) — 50.9K weekly downloads
- [@fluid-topics/ft-icon](https://npm.io/package/@fluid-topics/ft-icon.md) — 20.6K weekly downloads

## Recent versions

- 1.0.2 (latest) — 2023-11-21
- 1.0.1 — 2023-11-20
- 1.0.0 — 2023-10-29

## README

# Heading Tool For EditorJs

Provides Headings Blocks for the [Editor.js](https://editorjs.io).

## Installation

### Installation

# npm

```shell
npm i --save @juratbek/editorjs-header
```

# yarn

```shell
npm i --save @juratbek/editorjs-header
```

## Usage

Add the Code tool to the `tools` property of the Editor.js initial config.

```javascript
import EditorJs from "@editorjs/editorjs";
import Header from "@juratbek/editorjs-header";

const editor = EditorJs({
  // ...
  tools: {
    header: Header,
  },
});
```

## Shortcut

You can insert this Block by a useful shortcut. Set it up with the `tools[].shortcut` property of the Editor's initial config.

```javascript
var editor = EditorJS({
  ...

  tools: {
    ...
    header: {
      class: Header,
      shortcut: 'CMD+SHIFT+H',
    },
  },

  ...
});
```

## Config Params

All properties are optional.

| Field        | Type       | Description                 |
| ------------ | ---------- | --------------------------- |
| placeholder  | `string`   | header's placeholder string |
| levels       | `number[]` | enabled heading levels      |
| defaultLevel | `number`   | default heading level       |

#

```javascript
var editor = EditorJS({
  ...

  tools: {
    ...
    header: {
      class: Header,
      config: {
        placeholder: 'Enter a header',
        levels: [2, 3, 4],
        defaultLevel: 3
      }
    }
  }

  ...
});
```

You can select one of six levels for heading.

## Output data

| Field | Type     | Description                                      |
| ----- | -------- | ------------------------------------------------ |
| text  | `string` | header's text                                    |
| level | `number` | level of header: 1 for H1, 2 for H2 ... 6 for H6 |

#

```json
{
  "type": "header",
  "data": {
    "text": "Why Telegram is the best messenger",
    "level": 2
  }
}
```

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