mirror of
https://github.com/codex-team/editor.js
synced 2024-06-29 10:50:23 +02:00
Toolbar toggler API (#1466)
* ToolBar Api Added * Change Log added * change Toggletoolbar to toggleBlockSetting * Update docs/CHANGELOG.md * Update editor.js * Update toggleBlockSetting to toggleBlockSettings * Apply suggestions from code review Co-authored-by: Peter Savchenko <specc.dev@gmail.com> * Apply suggestions from code review Co-authored-by: Peter Savchenko <specc.dev@gmail.com> * Changes requested by hata added Co-authored-by: Peter Savchenko <specc.dev@gmail.com>
This commit is contained in:
parent
143a539e01
commit
aa8675d61d
|
@ -2,6 +2,7 @@
|
||||||
|
|
||||||
### 2.19.2
|
### 2.19.2
|
||||||
|
|
||||||
|
- `New` - `toolbar.toggleBlockSettings()` API method added [#1442](https://github.com/codex-team/editor.js/issues/1421).
|
||||||
- `Improvements` - A generic type for Tool config added [#1516](https://github.com/codex-team/editor.js/issues/1516)
|
- `Improvements` - A generic type for Tool config added [#1516](https://github.com/codex-team/editor.js/issues/1516)
|
||||||
- `Improvements` - Remove unused `force` option in `Caret.navigateNext()` and `Caret.navigatePrevious()` [#857](https://github.com/codex-team/editor.js/issues/857#issuecomment-770363438).
|
- `Improvements` - Remove unused `force` option in `Caret.navigateNext()` and `Caret.navigatePrevious()` [#857](https://github.com/codex-team/editor.js/issues/857#issuecomment-770363438).
|
||||||
- `Improvements` - Remove bundles from the repo [#1541](https://github.com/codex-team/editor.js/pull/1541).
|
- `Improvements` - Remove bundles from the repo [#1541](https://github.com/codex-team/editor.js/pull/1541).
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { Toolbar } from '../../../../types/api';
|
import { Toolbar } from '../../../../types/api';
|
||||||
import Module from '../../__module';
|
import Module from '../../__module';
|
||||||
|
import * as _ from './../../utils';
|
||||||
/**
|
/**
|
||||||
* @class ToolbarAPI
|
* @class ToolbarAPI
|
||||||
* Provides methods for working with the Toolbar
|
* Provides methods for working with the Toolbar
|
||||||
|
@ -15,6 +15,7 @@ export default class ToolbarAPI extends Module {
|
||||||
return {
|
return {
|
||||||
close: (): void => this.close(),
|
close: (): void => this.close(),
|
||||||
open: (): void => this.open(),
|
open: (): void => this.open(),
|
||||||
|
toggleBlockSettings: (openingState?: boolean): void => this.toggleBlockSettings(openingState),
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -31,4 +32,35 @@ export default class ToolbarAPI extends Module {
|
||||||
public close(): void {
|
public close(): void {
|
||||||
this.Editor.Toolbar.close();
|
this.Editor.Toolbar.close();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Toggles Block Setting of the current block
|
||||||
|
*
|
||||||
|
* @param {boolean} openingState — opening state of Block Setting
|
||||||
|
*/
|
||||||
|
public toggleBlockSettings(openingState?: boolean): void {
|
||||||
|
if (this.Editor.BlockManager.currentBlockIndex === -1) {
|
||||||
|
_.logLabeled('Could\'t toggle the Toolbar because there is no block selected ', 'warn');
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Check that opening state is set or not */
|
||||||
|
const canOpenBlockSettings = openingState ?? !this.Editor.BlockSettings.opened;
|
||||||
|
|
||||||
|
/** Check if state same as current state */
|
||||||
|
if (openingState === this.Editor.BlockSettings.opened) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (canOpenBlockSettings) {
|
||||||
|
if (!this.Editor.Toolbar.opened) {
|
||||||
|
this.Editor.Toolbar.open(true, false);
|
||||||
|
this.Editor.Toolbar.plusButton.hide();
|
||||||
|
}
|
||||||
|
this.Editor.BlockSettings.open();
|
||||||
|
} else {
|
||||||
|
this.Editor.BlockSettings.close();
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -30,7 +30,7 @@ export default class BlockSettings extends Module<BlockSettingsNodes> {
|
||||||
*
|
*
|
||||||
* @returns {{opened: string, closed: string}}
|
* @returns {{opened: string, closed: string}}
|
||||||
*/
|
*/
|
||||||
public get events(): {opened: string; closed: string} {
|
public get events(): { opened: string; closed: string } {
|
||||||
return {
|
return {
|
||||||
opened: 'block-settings-opened',
|
opened: 'block-settings-opened',
|
||||||
closed: 'block-settings-closed',
|
closed: 'block-settings-closed',
|
||||||
|
@ -42,7 +42,7 @@ export default class BlockSettings extends Module<BlockSettingsNodes> {
|
||||||
*
|
*
|
||||||
* @returns {{wrapper, wrapperOpened, toolSettings, defaultSettings, button}}
|
* @returns {{wrapper, wrapperOpened, toolSettings, defaultSettings, button}}
|
||||||
*/
|
*/
|
||||||
public get CSS(): {[name: string]: string} {
|
public get CSS(): { [name: string]: string } {
|
||||||
return {
|
return {
|
||||||
// Settings Panel
|
// Settings Panel
|
||||||
wrapper: 'ce-settings',
|
wrapper: 'ce-settings',
|
||||||
|
@ -170,7 +170,12 @@ export default class BlockSettings extends Module<BlockSettingsNodes> {
|
||||||
}
|
}
|
||||||
|
|
||||||
this.selection.clearSaved();
|
this.selection.clearSaved();
|
||||||
|
/**
|
||||||
|
* Remove highlighted content of a Block we are working with
|
||||||
|
*/
|
||||||
|
if (this.Editor.BlockManager.currentBlock) {
|
||||||
|
this.Editor.BlockManager.currentBlock.selected = false;
|
||||||
|
}
|
||||||
/** Clear settings */
|
/** Clear settings */
|
||||||
this.nodes.toolSettings.innerHTML = '';
|
this.nodes.toolSettings.innerHTML = '';
|
||||||
this.nodes.defaultSettings.innerHTML = '';
|
this.nodes.defaultSettings.innerHTML = '';
|
||||||
|
|
6
types/api/toolbar.d.ts
vendored
6
types/api/toolbar.d.ts
vendored
|
@ -11,4 +11,10 @@ export interface Toolbar {
|
||||||
* Opens Toolbar
|
* Opens Toolbar
|
||||||
*/
|
*/
|
||||||
open(): void;
|
open(): void;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Toggles Block Setting of the current block
|
||||||
|
* @param {boolean} openingState — opening state of Block Setting
|
||||||
|
*/
|
||||||
|
toggleBlockSettings(openingState?: boolean): void;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue