Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@editorjs/editorjs
Advanced tools
@editorjs/editorjs - npm Package Compare versions
Comparing version 2.16.1 to 2.17.0
| { | ||
| "name": "@editorjs/editorjs", | ||
| "version": "2.16.1", | ||
| "version": "2.17.0", | ||
| "description": "Editor.js — Native JS, based on API and Open Source", | ||
@@ -5,0 +5,0 @@ "main": "dist/editor.js", |
@@ -21,4 +21,2 @@ <a href="https://editorjs.io/"><p align="center"><img src="https://capella.pics/79ce946a-d636-41cd-aa96-d3bc5ecfde03.jpg"></p></a> | ||
| 👉 Bitcoin: `3DCCemgtE6GrzehVpU6Sa2RJHFUUh8iT9q` | ||
| ### Sponsors | ||
@@ -40,7 +38,7 @@ | ||
| We are really welcome new contributors. If you want to make some code with us, please take a look at the [Good First Tasks](https://github.com/codex-team/editor.js/issues?q=is%3Aopen+is%3Aissue+label%3A%22good+first+task%22). You can write to us on `team@codex.so` or via special [Telegram chat](https://t.me/editorjsdev), or any other way. | ||
| We really welcome new contributors. If you want to make some code with us, please take a look at the [Good First Tasks](https://github.com/codex-team/editor.js/issues?q=is%3Aopen+is%3Aissue+label%3A%22good+first+task%22). You can write to us on `team@codex.so` or via special [Telegram chat](https://t.me/editorjsdev), or any other way. | ||
| ## Documentation | ||
| Please, visit [https://editorjs.io/](https://editorjs.io) to view all documentation articles. | ||
| Please visit [https://editorjs.io/](https://editorjs.io) to view all documentation articles. | ||
@@ -58,5 +56,5 @@ - [Base concepts](https://editorjs.io/base-concepts) | ||
| See a whole [Changelog](/docs/CHANGELOG.md) | ||
| See the whole [Changelog](/docs/CHANGELOG.md) | ||
| ## So how to use Editor.js | ||
| ## How to use Editor.js | ||
@@ -69,5 +67,5 @@ ### Basics | ||
| So how to use the Editor after [Installation](https://editorjs.io/getting-started). | ||
| How to use the Editor after [Installation](https://editorjs.io/getting-started). | ||
| - Create new Blocks by Enter or with the Plus Button | ||
| - Create new Blocks by pressing Enter or clicking the Plus Button | ||
| - Press `TAB` or click on the Plus Button to view the Toolbox | ||
@@ -79,8 +77,8 @@ - Press `TAB` again to leaf Toolbox and select a Block you need. Then press Enter. | ||
| - Select text fragment and apply a style or insert a link from the Inline Toolbar | ||
| - Select a text fragment and apply a style or insert a link from the Inline Toolbar | ||
|  | ||
| - Use «three-dots» button on the right to open Block Settings. From here, you can move and delete a Block | ||
| or apply Tool's settings, if it provided. For example, set a Heading level or List style. | ||
| - Use the «three-dots» button on the right to open Block Settings. From here, you can move and delete a Block | ||
| or apply a Tool's settings, if it provided. For example, you can set a Heading level or List style. | ||
@@ -91,3 +89,3 @@  | ||
| We really appreciate shortcuts. So there are few presets. | ||
| A few shortcuts are preset as available. | ||
@@ -103,3 +101,3 @@ Shortcut | Action | Restrictions | ||
| Also we support shortcuts on the all type of Tools. Specify a shortcut with the Tools configuration. For example: | ||
| Each Tool can also have its own shortcuts. These are specified in the configuration of the Tool, for example: | ||
@@ -133,5 +131,5 @@ ```js | ||
| ### Load Editor's core | ||
| ### Step 1. Load Editor's core | ||
| Firstly you need to get Editor.js itself. It is a [minified script](dist/editor.js) with Editor's core and some default must-have tools. | ||
| Get Editor.js itself. It is a [minified script](dist/editor.js) with Editor's core and some default must-have tools. | ||
@@ -144,3 +142,3 @@ Choose the most usable method of getting Editor for you. | ||
| #### Node.js | ||
| ##### Option A. NPM install | ||
@@ -159,17 +157,17 @@ Install the package via NPM or Yarn | ||
| #### Use from CDN | ||
| ##### Option B. Use a CDN | ||
| You can load specific version of package from [jsDelivr CDN](https://www.jsdelivr.com/package/npm/@editorjs/editorjs). | ||
| You can load EditorJS directly from from [jsDelivr CDN](https://www.jsdelivr.com/package/npm/@editorjs/editorjs). | ||
| `https://cdn.jsdelivr.net/npm/@editorjs/editorjs@latest` | ||
| Then require this script. | ||
| For example, place this in your HTML: | ||
| ```html | ||
| <script src="..."></script> | ||
| <script src="https://cdn.jsdelivr.net/npm/@editorjs/editorjs@latest"></script> | ||
| ``` | ||
| #### Save sources to project | ||
| ##### Option C. Save source within your project | ||
| Copy [editor.js](dist/editor.js) file to your project and load it. | ||
| Copy the [editor.js](dist/editor.js) file to your project and load it. | ||
@@ -180,12 +178,6 @@ ```html | ||
| ### Load Tools | ||
| ### Step 2. Load the Tools that you want to make available | ||
| Each Block at the Editor.js is represented by [Tools](docs/tools.md). There are simple external scripts with their own logic. Probably you want to use several Block Tools that should be connected. | ||
| Each Block is represented by a [Tool](docs/tools.md). Tools are simple external scripts with their own logic. For example, there is a [Header](https://github.com/editor-js/header) Tool into which you type your heading text. If you want to be able to use this, install the Header Tool the same way as the Editor (Node.js, CDN, local file). | ||
| For example check out our [Header](https://github.com/editor-js/header) Tool that represents heading blocks. | ||
| You can install Header Tool by the same way as the Editor (Node.js, CDN, local file). | ||
| Check [Editor.js's community](https://github.com/editor-js/) to see more ready-to-use Tools. | ||
| **Example:** use Header from CDN | ||
@@ -197,4 +189,6 @@ | ||
| ### Create Editor instance | ||
| Check [Editor.js's community](https://github.com/editor-js/) to see more ready-to-use Tools. | ||
| ### Step 3. Create Editor instance | ||
| Create an instance of Editor.js and pass [Configuration Object](types/configs/editor-config.d.ts) with `holderId` and tools list. | ||
@@ -201,0 +195,0 @@ |
@@ -36,2 +36,3 @@ import {OutputData} from '../data-formats/output-data'; | ||
| * @param {number} toIndex - block to swap with | ||
| * @deprecated — use 'move' instead | ||
| */ | ||
@@ -41,2 +42,9 @@ swap(fromIndex: number, toIndex: number): void; | ||
| /** | ||
| * Moves a block to a new index | ||
| * @param {number} toIndex - index where the block is moved to | ||
| * @param {number} fromIndex - block to move | ||
| */ | ||
| move(toIndex: number, fromIndex?: number): void; | ||
| /** | ||
| * Returns Block holder by Block index | ||
@@ -43,0 +51,0 @@ * @param {number} index |
| import {ToolConstructable, ToolSettings} from '../tools'; | ||
| import {LogLevels, OutputData} from '../index'; | ||
| import {LogLevels, OutputData, API} from '../index'; | ||
| import {SanitizerConfig} from './sanitizer-config'; | ||
@@ -72,4 +72,5 @@ | ||
| * Fires when something changed in DOM | ||
| * @param {API} api - editor.js api | ||
| */ | ||
| onChange?(): void; | ||
| onChange?(api: API): void; | ||
| } |
@@ -1,7 +0,8 @@ | ||
| import {ConversionConfig, PasteConfig, SanitizerConfig} from '../configs'; | ||
| import {BlockToolData} from './block-tool-data'; | ||
| import {BaseTool, BaseToolConstructable} from './tool'; | ||
| import {ToolConfig} from './tool-config'; | ||
| import {API} from '../index'; | ||
| import {PasteEvent} from './paste-events'; | ||
| import { ConversionConfig, PasteConfig, SanitizerConfig } from '../configs'; | ||
| import { BlockToolData } from './block-tool-data'; | ||
| import { BaseTool, BaseToolConstructable } from './tool'; | ||
| import { ToolConfig } from './tool-config'; | ||
| import { API } from '../index'; | ||
| import { PasteEvent } from './paste-events'; | ||
| import { MoveEvent } from './hook-events'; | ||
| /** | ||
@@ -68,2 +69,7 @@ * Describe Block Tool object | ||
| removed?(): void; | ||
| /** | ||
| * Called after block was moved | ||
| */ | ||
| moved?(event: MoveEvent): void; | ||
| } | ||
@@ -101,3 +107,3 @@ | ||
| */ | ||
| new (config: {api: API, config: ToolConfig, data: BlockToolData}): BlockTool; | ||
| new(config: { api: API, config: ToolConfig, data: BlockToolData }): BlockTool; | ||
| } |
@@ -12,4 +12,5 @@ import {BlockTool, BlockToolConstructable} from './block-tool'; | ||
| export * from './paste-events'; | ||
| export * from './hook-events'; | ||
| export type Tool = BaseTool | BlockTool | InlineTool; | ||
| export type ToolConstructable = BaseToolConstructable | BlockToolConstructable | InlineToolConstructable; |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by83.15%
712220
- Number of package files
- increased by2.44%
42
- Lines of code
- increased by3.92%
955
Worsened metrics
- Number of lines in readme file
- decreased by-2.31%
254
No dependency changes