UNPKG

2.03 kBJavaScriptView Raw
1/**
2 * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3 * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4 */
5/**
6 * @module block-quote/blockquoteui
7 */
8import { Plugin, icons } from 'ckeditor5/src/core.js';
9import { ButtonView, MenuBarMenuListItemButtonView } from 'ckeditor5/src/ui.js';
10import '../theme/blockquote.css';
11/**
12 * The block quote UI plugin.
13 *
14 * It introduces the `'blockQuote'` button.
15 *
16 * @extends module:core/plugin~Plugin
17 */
18export default class BlockQuoteUI extends Plugin {
19 /**
20 * @inheritDoc
21 */
22 static get pluginName() {
23 return 'BlockQuoteUI';
24 }
25 /**
26 * @inheritDoc
27 */
28 init() {
29 const editor = this.editor;
30 const command = editor.commands.get('blockQuote');
31 editor.ui.componentFactory.add('blockQuote', () => {
32 const buttonView = this._createButton(ButtonView);
33 buttonView.set({
34 tooltip: true
35 });
36 // Bind button model to command.
37 buttonView.bind('isOn').to(command, 'value');
38 return buttonView;
39 });
40 editor.ui.componentFactory.add('menuBar:blockQuote', () => this._createButton(MenuBarMenuListItemButtonView));
41 }
42 /**
43 * Creates a button for block quote command to use either in toolbar or in menu bar.
44 */
45 _createButton(ButtonClass) {
46 const editor = this.editor;
47 const locale = editor.locale;
48 const command = editor.commands.get('blockQuote');
49 const view = new ButtonClass(editor.locale);
50 const t = locale.t;
51 view.set({
52 label: t('Block quote'),
53 icon: icons.quote,
54 isToggleable: true
55 });
56 view.bind('isEnabled').to(command, 'isEnabled');
57 // Execute the command.
58 this.listenTo(view, 'execute', () => {
59 editor.execute('blockQuote');
60 editor.editing.view.focus();
61 });
62 return view;
63 }
64}