diff --git a/.yarn/install-state.gz b/.yarn/install-state.gz index 38a6ce6..a159e85 100644 Binary files a/.yarn/install-state.gz and b/.yarn/install-state.gz differ diff --git a/README.md b/README.md index 9ba6d54..43b83a5 100644 --- a/README.md +++ b/README.md @@ -7,7 +7,9 @@
[![npm version](https://badge.fury.io/js/react-editor-js.svg)](https://badge.fury.io/js/react-editor-js) + ![LICENSE](https://img.shields.io/npm/l/react-editor-js?color=blue) + [![Github Build Status](https://github.com/Jungwoo-An/react-editor-js/workflows/release/badge.svg)](https://github.com/Jungwoo-An/react-editor-js/actions) [![Semantic Release enabled](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release) @@ -15,26 +17,26 @@ ## 🍞 DEMO -- [CodeSandbox](https://codesandbox.io/s/react-editor-js-v2-34bfl) +* [CodeSandbox](https://codesandbox.io/s/react-editor-js-v2-34bfl) ## 🍀 Supported Official Plugin -- [x] Paragraph (default) -- [x] Embed -- [x] Table -- [x] List -- [x] Warning -- [x] Code -- [x] Link -- [x] Image -- [x] Raw -- [x] Header -- [x] Quote -- [x] Marker -- [x] CheckList -- [x] Delimiter -- [x] InlineCode -- [x] SimpleImage +* [x] Paragraph (default) +* [x] Embed +* [x] Table +* [x] List +* [x] Warning +* [x] Code +* [x] Link +* [x] Image +* [x] Raw +* [x] Header +* [x] Quote +* [x] Marker +* [x] CheckList +* [x] Delimiter +* [x] InlineCode +* [x] SimpleImage ## 🤟🏻 Getting Started @@ -68,7 +70,7 @@ Allow all options of [editor-js](https://github.com/codex-team/editor.js/blob/ma There is an only Paragraph block already included in Editor.js. Probably you want to use several Block Tools that should be installed and connected. -To add more Block Tools, simply add them to your repo and pass them as `tools`-property to your editor: +To add more Block Tools, simply add them to your repo and pass them as `tools` -property to your editor: ``` npm install --save-dev @editorjs/checklist @@ -160,6 +162,26 @@ interface EditorCore { save(): Promise render(data: OutputData): Promise + + toggleReadOnly(): Promise + + insertBlock(type?: string, data?: BlockToolData, config?: ToolConfig, index?: number, needToFocus?: boolean): Promise + + updateBlock(id?: string, data?: BlockToolData): Promise + + deleteBlock(index?: number): Promise + + setToFirstBlock(position: string, offset: number): Promise + + setToLastBlock(position: string, offset: number): Promise + + setToBlock(index: number, position: string, offset: number): Promise + + focus(atEnd: boolean): Promise + + openToolbar(): Promise + + closeToolbar(): Promise } ``` diff --git a/packages/@react-editor-js/client/src/client-editor-core.ts b/packages/@react-editor-js/client/src/client-editor-core.ts index a3c4a0b..b4e2d68 100644 --- a/packages/@react-editor-js/client/src/client-editor-core.ts +++ b/packages/@react-editor-js/client/src/client-editor-core.ts @@ -1,4 +1,4 @@ -import EditorJS, { EditorConfig, OutputData } from '@editorjs/editorjs' +import EditorJS, { EditorConfig, OutputData, BlockToolData, ToolConfig } from '@editorjs/editorjs' import Paragraph from '@editorjs/paragraph' import { EditorCore } from '@react-editor-js/core' @@ -36,4 +36,44 @@ export class ClientEditorCore implements EditorCore { public async render(data: OutputData) { await this._editorJS.render(data) } + + public async toggleReadOnly() { + return this._editorJS.readOnly.toggle() + } + + public async insertBlock(type?: string, data?: BlockToolData, config?: ToolConfig, index?: number, needToFocus?: boolean) { + return this._editorJS.blocks.insert(type, data, config, index, needToFocus) + } + + public async updateBlock(id?: string, data?: BlockToolData) { + return this._editorJS.blocks.update(id, data) + } + + public async deleteBlock(index?: number) { + return this._editorJS.blocks.delete(index) + } + + public async setToFirstBlock(position: string = this._editorJS.Caret.positions.DEFAULT, offset: number = 0) { + return this._editorJS.caret.setToFirstBlock(position, offset) + } + + public async setToLastBlock(position: string = this._editorJS.Caret.positions.DEFAULT, offset: number = 0) { + return this._editorJS.caret.setToLastBlock(position, offset) + } + + public async setToBlock(index: number, position: string = this._editorJS.Caret.positions.DEFAULT, offset: number = 0) { + return this._editorJS.caret.setToBlock(index, position, offset) + } + + public async focus(atEnd: boolean = false) { + return this._editorJS.caret.focus(atEnd) + } + + public async openToolbar() { + return this._editorJS.toolbar.open() + } + + public async closeToolbar() { + return this._editorJS.toolbar.close() + } } diff --git a/packages/@react-editor-js/core/src/editor-core.ts b/packages/@react-editor-js/core/src/editor-core.ts index 82d69e6..c59afa2 100644 --- a/packages/@react-editor-js/core/src/editor-core.ts +++ b/packages/@react-editor-js/core/src/editor-core.ts @@ -1,4 +1,4 @@ -import { OutputData } from '@editorjs/editorjs' +import { OutputData, BlockToolData, ToolConfig } from '@editorjs/editorjs' export interface EditorCore { destroy(): Promise @@ -8,4 +8,24 @@ export interface EditorCore { save(): Promise render(data: OutputData): Promise + + toggleReadOnly(): Promise + + insertBlock(type?: string, data?: BlockToolData, config?: ToolConfig, index?: number, needToFocus?: boolean): Promise + + updateBlock(id?: string, data?: BlockToolData): Promise + + deleteBlock(index?: number): Promise + + setToFirstBlock(position: string, offset: number): Promise + + setToLastBlock(position: string, offset: number): Promise + + setToBlock(index: number, position: string, offset: number): Promise + + focus(atEnd: boolean): Promise + + openToolbar(): Promise + + closeToolbar(): Promise } diff --git a/packages/@react-editor-js/core/tests/TestEditorCore.ts b/packages/@react-editor-js/core/tests/TestEditorCore.ts index 50b0fde..4ce7d9f 100644 --- a/packages/@react-editor-js/core/tests/TestEditorCore.ts +++ b/packages/@react-editor-js/core/tests/TestEditorCore.ts @@ -5,12 +5,18 @@ import { EditorCore } from '../src' export class TestEditorCore implements EditorCore { private _data: OutputData | null = null + private _readOnly: boolean = false + constructor() {} public get data() { return this._data } + public get readOnly() { + return this._readOnly + } + public async clear() {} public async save() { @@ -24,4 +30,33 @@ export class TestEditorCore implements EditorCore { public async render(data: OutputData) { this._data = data } + + public async toggleReadOnly() { + this._readOnly = !this._readOnly + return this._readOnly + } + + public async insertBlock() {} + + public async updateBlock() {} + + public async deleteBlock() {} + + public async setToFirstBlock() { + return false + } + + public async setToLastBlock() { + return false + } + + public async setToBlock() { + return false + } + + public async focus() {} + + public async openToolbar() {} + + public async closeToolbar() {} } diff --git a/packages/@react-editor-js/server/src/server-editor-core.ts b/packages/@react-editor-js/server/src/server-editor-core.ts index c21413b..fbf2f03 100644 --- a/packages/@react-editor-js/server/src/server-editor-core.ts +++ b/packages/@react-editor-js/server/src/server-editor-core.ts @@ -19,4 +19,32 @@ export class ServerEditorCore implements EditorCore { public async destroy() {} public async render() {} + + public async toggleReadOnly() { + return false + } + + public async insertBlock() {} + + public async updateBlock() {} + + public async deleteBlock() {} + + public async setToFirstBlock() { + return false + } + + public async setToLastBlock() { + return false + } + + public async setToBlock() { + return false + } + + public async focus() {} + + public async openToolbar() {} + + public async closeToolbar() {} } diff --git a/yarn.lock b/yarn.lock index 2923143..9d0900d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -821,13 +821,13 @@ __metadata: languageName: node linkType: hard -"@react-editor-js/client@2.0.5, @react-editor-js/client@workspace:packages/@react-editor-js/client": +"@react-editor-js/client@2.0.6, @react-editor-js/client@workspace:packages/@react-editor-js/client": version: 0.0.0-use.local resolution: "@react-editor-js/client@workspace:packages/@react-editor-js/client" dependencies: "@editorjs/editorjs": "*" "@editorjs/paragraph": "*" - "@react-editor-js/core": 2.0.5 + "@react-editor-js/core": 2.0.6 "@types/react": "*" react: "*" tslib: ^2.3.1 @@ -839,7 +839,7 @@ __metadata: languageName: unknown linkType: soft -"@react-editor-js/core@2.0.5, @react-editor-js/core@workspace:packages/@react-editor-js/core": +"@react-editor-js/core@2.0.6, @react-editor-js/core@workspace:packages/@react-editor-js/core": version: 0.0.0-use.local resolution: "@react-editor-js/core@workspace:packages/@react-editor-js/core" dependencies: @@ -857,13 +857,13 @@ __metadata: languageName: unknown linkType: soft -"@react-editor-js/server@2.0.5, @react-editor-js/server@workspace:packages/@react-editor-js/server": +"@react-editor-js/server@2.0.6, @react-editor-js/server@workspace:packages/@react-editor-js/server": version: 0.0.0-use.local resolution: "@react-editor-js/server@workspace:packages/@react-editor-js/server" dependencies: "@editorjs/editorjs": "*" "@editorjs/paragraph": "*" - "@react-editor-js/core": 2.0.5 + "@react-editor-js/core": 2.0.6 "@types/react": "*" react: "*" tslib: ^2.3.1 @@ -871,7 +871,7 @@ __metadata: peerDependencies: "@editorjs/editorjs": "*" "@editorjs/paragraph": "*" - "@react-editor-js/core": 2.0.5 + "@react-editor-js/core": 2.0.6 react: "*" languageName: unknown linkType: soft @@ -5803,14 +5803,14 @@ __metadata: version: 0.0.0-use.local resolution: "react-editor-js@workspace:packages/react-editor-js" dependencies: - "@react-editor-js/client": 2.0.5 - "@react-editor-js/server": 2.0.5 + "@react-editor-js/client": 2.0.6 + "@react-editor-js/server": 2.0.6 "@types/node": ^16.11.6 tslib: ^2.3.1 typescript: ^4.3.5 peerDependencies: - "@react-editor-js/client": 2.0.5 - "@react-editor-js/server": 2.0.5 + "@react-editor-js/client": 2.0.6 + "@react-editor-js/server": 2.0.6 languageName: unknown linkType: soft