/** * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options */ /** * @module slash-command/slashcommandconfig * @publicApi */ import { Plugin, type Editor } from '@ckeditor/ckeditor5-core'; import './slashcommandeditorconfig.js'; /** * This plugin takes care of the configuration for {@link module:slash-command/slashcommand~SlashCommand}: * * * It manages the configuration of slash commands in the editor. * * It provides default slash commands for common editor features. * * It allows defining extra commands and reducing the list of defaults using the editor configuration. * See {@link module:slash-command/slashcommandconfig~SlashCommandConfig} to learn more. * * @extends module:core/plugin~Plugin */ export declare class SlashCommandConfig extends Plugin { /** * @inheritDoc */ static get pluginName(): "SlashCommandConfig"; /** * @inheritDoc */ static get isOfficialPlugin(): true; /** * @inheritDoc */ static get isPremiumPlugin(): true; /** * @inheritDoc */ constructor(editor: Editor); /** * @inheritDoc */ afterInit(): void; /** * Returns an array of slash command definitions enabled in the editor. * * This method takes into account the following: * * The {@link module:slash-command/slashcommandconfig~SlashCommandConfig#getDefaultCommands list of default commands}. * * The presence of {@link module:core/editor/editorconfig~EditorConfig#plugins editor features} (plugins). * * The {@link module:slash-command/slashcommandeditorconfig~SlashCommandEditorConfig#removeCommands} configuration. * * The {@link module:slash-command/slashcommandeditorconfig~SlashCommandEditorConfig#extraCommands} configuration. */ getAllowedCommands(): Array; /** * Returns a list of default slash command {@link module:slash-command/slashcommandconfig~SlashCommandDefinition definitions} * for common editor features. The available definitions are as follows: * * ```js * [ * { * id: 'blockQuote', * commandName: 'blockQuote', * title: t( 'Block quote' ), * // ... * }, * { * id: 'bulletedList', * commandName: 'bulletedList', * title: t( 'Bulleted list' ), * // ... * }, * { * id: 'codeBlock', * commandName: 'codeBlock', * title: t( 'Insert code block' ), * // ... * }, * { * id: 'ckbox', * commandName: 'ckbox', * title: t( 'Open file manager' ), * // ... * }, * { * id: 'ckfinder', * commandName: 'ckfinder', * title: t( 'Insert image' ), * // ... * }, * { * id: 'heading1', * commandName: 'heading', * title: t( 'Heading 1' ), * // ... * }, * { * id: 'heading2', * commandName: 'heading', * title: t( 'Heading 2' ), * // ... * }, * { * id: 'heading3', * commandName: 'heading', * title: t( 'Heading 3' ), * // ... * }, * { * id: 'heading4', * commandName: 'heading', * title: t( 'Heading 4' ), * // ... * }, * { * id: 'heading5', * commandName: 'heading', * title: t( 'Heading 5' ), * // ... * }, * { * id: 'heading6', * commandName: 'heading', * title: t( 'Heading 6' ), * // ... * }, * { * id: 'horizontalLine', * commandName: 'horizontalLine', * title: t( 'Horizontal line' ), * // ... * }, * { * id: 'htmlEmbed', * commandName: 'htmlEmbed', * title: t( 'Insert HTML' ), * // ... * }, * { * id: 'indent', * commandName: 'indent', * title: t( 'Increase indent' ), * // ... * }, * { * id: 'insertMermaidCommand', * commandName: 'insertMermaidCommand', * title: t( 'Insert Mermaid diagram' ), * // ... * }, * { * id: 'insertTable', * commandName: 'insertTable', * title: t( 'Insert table' ), * // ... * }, * { * id: 'insertTableOfContents', * commandName: 'insertTableOfContents', * title: t( 'Table of contents' ), * // ... * }, * { * id: 'numberedList', * commandName: 'numberedList', * title: t( 'Numbered list' ), * // ... * }, * { * id: 'outdent', * commandName: 'outdent', * title: t( 'Decrease indent' ), * // ... * }, * { * id: 'paragraph', * commandName: 'paragraph', * title: t( 'Paragraph' ), * // ... * }, * { * id: 'todoList', * commandName: 'todoList', * title: t( 'To-do list' ), * // ... * }, * { * id: 'footnote', * commandName: 'insertFootnote', * title: t( 'Footnote' ), * // ... * } * ] */ getDefaultCommands(): Array; } /** * An object describing a single command definition in the configuration. */ export interface SlashCommandDefinition { /** * A unique ID matched with the text that follows the slash ("/") character typed by the user, * e.g. 'blockQuote', 'heading1'. See {@link module:slash-command/slashcommandconfig~SlashCommandDefinition#aliases} * to learn about slash command aliases that provide a similar functionality. */ id: string; /** * The name of the command to be executed if the `execute` property was not provided, * for example, 'blockQuote', 'heading'. See {@link module:core/editor/editor~Editor#commands} to learn more about available commands. */ commandName?: string; /** * A meaningful title for the command displayed in a dropdown list of possible commands. It can be a string * or a callback function returning a string. */ title: Function | string; /** * An optional description for the command. Useful when the title is not descriptive enough. */ description?: string; /** * An SVG string representing the icon of the command. If not provided, a generic icon will be used instead. * The default size of the icon is 20x20 pixels. Be sure to set the correct `viewBox` attribute in the icon source. * * See {@link module:slash-command/slashcommandconfig~SlashCommandDefinition#isIconColorInherited}. */ icon?: string; /** * By default, slash command icons are monochromatic and inherit the color of the text in the editor UI. * Setting this property to `false` disables this inheritance and allows the use of complex (colorful) icons. * * Learn more in {@link module:ui/icon/iconview~IconView#isColorInherited}. */ isIconColorInherited?: boolean; /** * An optional list of aliases (extending the base * {@link module:slash-command/slashcommandconfig~SlashCommandDefinition#id}) to be used when filtering the list of slash commands * based on the text that follows the slash ("/") character. */ aliases?: Array; /** * A callback function defining custom logic to decide if the command should be displayed * in the dropdown list. If not provided, the default command's {@link module:core/command~Command#isEnabled} property is used instead. * If it's also unavailable, it falls back to `true`. This property is checked when a user types the slash ("/") character * or changes the text that follows it. * * This callback gets an {@link module:core/editor/editor~Editor} instance as a parameter. */ isEnabled?: Function; /** * A callback function defining custom logic for executing the command. If not provided, the default * command's {@link module:core/command~Command#execute} is used instead. Custom logic is useful especially when the slash command * requires some arguments (acts like a wrapper) or combines some complex logic. This property is obligatory if * {@link module:slash-command/slashcommandconfig~SlashCommandDefinition#commandName} was not passed. * * This callback gets an {@link module:core/editor/editor~Editor} instance as a parameter. */ execute?: Function; }